A calendar example is displayed in ASP. NET, and an asp.net example is displayed.

A calendar example is displayed in ASP. NET, and an asp.net example is displayed.

In. net.. net instance. Of course, we can also use js calendar for instance. Let me give you two simple examples. If you need it, you can find out.

The Code is as follows:

<% @ Control Language = "c #" AutoEventWireup = "false" Codebehind = "ctlCalendar. ascx. cs" Inherits = "calendar. ctlCalendar" TargetSchema =" http://schemas.microsoft.com/intellisense/ie5 "EnableViewState =" True "%> <asp: textbox id =" TextBox1 "runat =" server "> </asp: textbox> <input type = "button" id = "Button1" runat = "server" value = "... "> <br> <asp: Panel id =" pnlCalendar "runat =" server "style =" POSITION: absolute "> <asp: calendar id = "Calendar1" runat = "server" FirstDayOfWeek = "Monday" ShowGridLines = "True" BackColor = "White" DayNameFormat = "Full" ForeColor = "Black" Font-Size = "8pt" Font-Names = "Verdana" BorderColor = "#999999" CellPadding = "4" Width = "200px" Height = "180px"> <TodayDayStyle ForeColor = "Black" BackColor = "# CCCCCC"> </TodayDayStyle> <SelectorStyle BackColor = "# CCCCCC"> </SelectorStyle> <DayStyle Wrap = "False" BorderStyle = "Dashed"> </DayStyle> <NextPrevStyle VerticalAlign = "Bottom"> </NextPrevStyle> <DayHeaderStyle Font-Size = "X-Small" Font-Names = "" Wrap = "False" BorderStyle = "Dashed" backColor = "# CCCCCC"> </DayHeaderStyle> <SelectedDayStyle Font-Bold = "True" ForeColor = "White" BackColor = "#666666"> </SelectedDayStyle> <TitleStyle Font- size = "Small" Font-Bold = "True" BorderStyle = "Solid" BorderColor = "Black" BackColor = "#999999"> </TitleStyle> <WeekendDayStyle BackColor = "LightSteelBlue"> </WeekendDayStyle> <OtherMonthDayStyle ForeColor = "Gray"> </OtherMonthDayStyle> </asp: calendar> </asp: Panel>

Cs code

Namespace calendar {using System; using System. data; using System. drawing; using System. web; using System. web. UI. webControls; using System. web. UI. htmlControls; // <summary> // abstract description of ctlCalendar. /// </Summary> public class ctlCalendar: System. web. UI. userControl {protected System. web. UI. webControls. textBox TextBox1; protected System. web. UI. webControls. panel pnlCalendar; protected System. web. UI. htmlControls. htmlInputButton Button1; protected System. web. UI. webControls. calendar Calendar1; private void Page_Load (object sender, System. eventArgs e) {// place the user code here to initialize the page if (! Page. isPostBack) {this. textBox1.Text = System. dateTime. now. toShortDateString (); this. pnlCalendar. attributes. add ("style", "DISPLAY: none; POSITION: absolute");} else {string id = Page. request. form ["_ EVENTTARGET"]. substring (0, Page. request. form ["_ EVENTTARGET"]. indexOf (":"); if (id! = This. ID) {this. pnlCalendar. attributes. add ("style", "DISPLAY: none; POSITION: absolute");} else {this. pnlCalendar. attributes. add ("style", "POSITION: absolute") ;}} Page. registerClientScriptBlock ("Script_Panel" + this. ID, "<script> function On" + this. ID + "Click () {if (" + this. ID + "_ pnlCalendar. style. display = "none") "+ this. ID + "_ pnlCalendar. style. display = ""; else "+ this. ID + "_ pnlCalendar. style. disp Lay = "none" ;}</script> "); this. button1.Attributes. add ("OnClick", "On" + this. ID + "Click ()") ;}# code override protected void OnInit (EventArgs e) generated by region Web forms designer {// CODEGEN: ASP.. NET Web form designer. // InitializeComponent (); base. onInit (e) ;}/// <summary> /// the designer supports the required methods-do not use the code editor /// to modify the content of this method. /// </Summary> private void InitializeComponent () {this. calendar1.SelectionChanged + = new System. eventHandler (this. calendar1_SelectionChanged); this. load + = new System. eventHandler (this. page_Load) ;}# endregion # private void calendar#selectionchanged (object sender, System. eventArgs e) {this. textBox1.Text = Calendar1.SelectedDate. toShortDateString (); this. pnlCalendar. attributes. add ("style", "DISPLAY: none; POSITION: absolute") ;}# endregion }}

Now, the following result is a calendar pop-up by js +. net.

Place two TEXTBOX and BUTTON on the page for the date to be called to select the start time and end time, and add the following before the html code </body>:

Javascript statement:

<script language="javascript">    function openModeBegin()    {    var returnValue=window.showModalDialog("CalendarForm2.aspx",Form1.TextBoxBeginDate.value);   Form1.TextBoxBeginDate.value=returnValue;    }  </script>  <script language="javascript">    function openModeEnd()    {    var returnValue=window.showModalDialog("CalendarForm2.aspx",Form1.TextBoxEndDate.value);    Form1.TextBoxEndDate.value=returnValue;    }  </script>

The preceding statements define two modal dialogs. When the modal dialog box is called, The CalendarForm2.aspx page is displayed to select a date. The FORM on this page is named Form1, the two TextBox receive the two time values passed in separately and they should not affect each other. Note that the form definition in html should correspond to the definition in javascript and should be run on the server, for example, <form id = "Form1" method = "post" runat = "server">.

In the WebForm1.aspx. cs code section of this page, load the Page_Load event and add the following statement to assign the javascript behavior defined to the Button:

ButtonBeginDate.Attributes.Add("onclick", "openModeBegin()");   ButtonEndDate.Attributes.Add("onclick", "openModeEnd()");

CalendarForm2.aspx is a temporary container. It provides a framework to call the content of CalendarForm3.aspx, so that the value cannot be uploaded after the date selection form is disabled. The following statement should be added between its html Head mark:

The Code is as follows:

<script id="clientEventHandlersJS" language="javascript"> <!-- function IFRAME1_onblur() {} //-->  </script>

No code is required in the CalendarForm2.aspx. cs file. You only need to add the following code between the body tags:

The Code is as follows:

<body runat="server" ID="Body1">  <form id="Form1" method="post" runat="server">   <iframe frameborder="no" src='CalendarForm3.aspx' style="WIDTH: 480px; HEIGHT: 450px" id="IFRAME1"   language="javascript" onblur="return IFRAME1_onblur()"></iframe>  </form> </body>

CalendarForm3.aspx the date selection page we actually use contains a Calendar control and a Button and a TextBox. Here, it is easier to directly pass the selected value of the Calendar control Calendar to WebForm1.aspx on the first page, however, we did not do this. If we do not directly pass the value, we mainly take into account the usage habits of most users. Here, we will pass the selected value of the calendar control to the TextBox on the page, press the Button, and then pass it to WebForm1.aspx, it can also be easily corrected after the user misselects.

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.