Original source: http://www.codeproject.com/aspnet/popupcalendarcontrol.asp
in the asp.net implement pop-up calendar in
Author: Isaias Formacio-serna
You can find many implementations of the calendar controls, but I've found some problems when I use them because JavaScript and asp.net in these controls don't work together. My control allows you to put a calendar on the page that pops up but doesn't return, and you can use it as much as possible in the same form.
Introduce
There are many implementations of this control on the Web. My control is based on the work of Paul Kilmer, but I made some changes to where it doesn't work. Most of the changes are to replace the HMTL control with the ASP.net control, because it allows me to better control the background encoding of the control, which you will see in your code.
Creating Controls
First, you need to create a new control, in this case, I call it Ctlcalendar. In this control, you need to add a TextBox (TextBox1) control in the Web Forms Toolbox, add a Button (Button1) control in an HTML toolbox, and then add a Panel (Pnlcaledar) control in the Web Forms Toolbox , and finally, in this panel, add a Calendar (CALENDAR1) control in the Web Forms Toolbox. Notice that I am using the HTML Toolbox's Button1 control, because I don't need it to pass a value to the server when the user clicks on it.
Your control page will look like this:
Here is the code for CTLCALENDAR.ASCX:
<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" cellpadding= "4"
Bordercolor= "#999999" font-names= "Verdana" font-size= "8pt"
height= "180px" forecolor= "Black" daynameformat= "Firstletter"
Width= "200px" backcolor= "White" >
<todaydaystyle forecolor= "Black" backcolor= "#CCCCCC" ></TodayDayStyle>
<selectorstyle backcolor= "#CCCCCC" ></SelectorStyle>
<nextprevstyle verticalalign= "Bottom" ></NextPrevStyle>
<dayheaderstyle font-size= "7pt" font-bold= "True" backcolor= "#CCCCCC" >
</DayHeaderStyle>
<selecteddaystyle font-bold= "True" forecolor= "white" backcolor= "#666666" >
</SelectedDayStyle>
<titlestyle font-bold= "True" bordercolor= "Black" backcolor= "#999999" >
</TitleStyle>
<weekenddaystyle backcolor= "Lightsteelblue" ></WeekendDayStyle>
<othermonthdaystyle forecolor= "#808080" ></OtherMonthDayStyle>
</asp:calendar>
</asp:Panel>
Implementation features
Now, we're going to use two functions to implement its functionality. The first one is Page_Load, which initializes our control, and the second is calendar1_selectionchanged.
private void Page_Load (object sender, System.EventArgs e)
{
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+