The simplest method is as follows:
1. Create an aspx page and pull the calender control in.
2. The first step is to set the appearance. Based on your needs, you only need to make some adjustments to its related attributes. You can adjust it as shown in the following figure:
The property settings are as follows:
The code is as follows: |
Copy code |
<Asp: calendar id = "Calendar1" CellPadding = "2" Width = "160px" TitleStyle-BackColor = "#000000" BorderColor = "# aaaaaa" DayHeaderStyle-BackColor = "# 5e715e" OtherMonthDayStyle-ForeColor = "# cccccc" DayNameFormat = "Full" Runat = "server" TitleStyle-ForeColor = "# ffffff" NextPrevStyle-ForeColor = "# ffffff" CellSpacing = "1" WeekendDayStyle-BackColor = "# EEEEEEEE" DayHeaderStyle-ForeColor = "# ffffff" SelectionMode = "None" TodayDayStyle-BorderColor = "# 5e715e" TodayDayStyle-BorderWidth = "1" TodayDayStyle-Font-Bold = "true" TodayDayStyle-ForeColor = "# 5e715e" /> |
The second step is to adjust the internal functions. This work is mainly focused on the handling of the following events.
The code is as follows: |
Copy code |
PreRender: occurs when the server control is to be rendered to the Page object it contains. Private void calendar#prerender (object sender, System. EventArgs e) { Thread threadCurrent = Thread. CurrentThread; CultureInfo ciNew = (CultureInfo) threadCurrent. CurrentCulture. Clone (); CiNew. DateTimeFormat. DayNames = new string [] {"day", "1", "2", "3", "4", "5", "6 "}; CiNew. DateTimeFormat. FirstDayOfWeek = DayOfWeek. Sunday; ThreadCurrent. CurrentCulture = ciNew; } |
Example 2
Front-end:
The code is as follows: |
Copy code |
<Asp: ScriptManager ID = "ScriptManager1" runat = "server"> </Asp: ScriptManager> <Asp: UpdatePanel ID = "UpdatePanel1" runat = "server"> <ContentTemplate> <Div> <Asp: TextBox ID = "TextBox1" runat = "server" Width = "130px"> </asp: TextBox> <Asp: ImageButton ID = "ImageButton1" runat = "server" Width = "25px" Height = "25px" ImageUrl = "~ /Calender.png "onclick =" ImageButton1_Click "/> <Br/> <Div id = "LayerCC" style = "left: 167px; width: 220px; position: absolute; top: 40px; Height: 191px; background-color: white "visible =" false "runat =" server "> <Asp: Calendar ID = "Calendar1" runat = "server" BackColor = "# FFFFCC" BorderColor = "# FFCC66" BorderWidth = "1px" DayNameFormat = "Shortest" Font-Names = "Verdana" Font-Size = "8pt" ForeColor = "#663399" Height = "200px" ShowGridLines = "True" Width = "220px" Onselectionchanged = "calendar#selectionchanged"> <DayHeaderStyle BackColor = "#66 CCFF" Font-Bold = "True" Height = "1px"/> <DayStyle BackColor = "# CCFFFF"/> <NextPrevStyle Font-Size = "9pt" ForeColor = "# FFFFCC"/> <OtherMonthDayStyle ForeColor = "# CC9966"/> <SelectedDayStyle BackColor = "# CCCCFF" Font-Bold = "True"/> <SelectorStyle BackColor = "# FFCC66"/> <TitleStyle BackColor = "# 0066FF" Font-Bold = "True" Font-Size = "9pt" ForeColor = "# FFFFCC"/> <TodayDayStyle BackColor = "Red" ForeColor = "White"/> </Asp: Calendar> </Div> </Div> </ContentTemplate> </Asp: UpdatePanel> |
Background:
The code is as follows: |
Copy code |
Protected void ImageButton1_Click (object sender, ImageClickEventArgs e) { LayerCC. Style ["left"] = "167px "; LayerCC. Visible =! LayerCC. Visible; } Protected void Calendar1_SelectionChanged (object sender, EventArgs e) { TextBox1.Text = Calendar1.SelectedDate. ToString ("yyyy-MM-dd "); LayerCC. Visible = false; } |
Summary:
(1. Use some refactoring to separate some function methods. Some of them are not completely separated yet.
(2 the date control also has the VisiblMonthChanged event to handle the comparison of calendar whether the month has been changed by the user, such as e. NewDate. Year and e. Previusdate. Year.
(3 DayRender events, cell and Day can be used to present the special characteristics of dates, such as the colors of weekends and holidays,
E. Day. IsOtherMOnth e. Day. IsWeekend, etc.