<%@ Page Language="C#" %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > <html> <head> <title>Another Popup Calendar</title> <script language="javascript"> function DisplayCalendar(obj, calendarID, target) { var calendarObj = document.getElementById(calendarID); var hiddenCalendarPropertiesObj = document.getElementById("hiddenCalendarProperties"); var top = obj.style.top.replace("px", ""); var left = obj.style.left.replace("px", ""); if(calendarObj != null && hiddenCalendarPropertiesObj != null) { calendarObj.style.top = (1 * top + 15) + "px"; // Convert to int, concat back with string. calendarObj.style.left = (1 * left + 15) + "px"; calendarObj.style.visibility = "visible"; hiddenCalendarPropertiesObj.value = target + "+" + calendarObj.style.top + "+" + calendarObj.style.left; } } function HideCalendar(calendarID) { var calendarObj = document.getElementById(calendarID); if(calendarObj != null) {calendarObj.style.visibility = "hidden";} } </script> <script language="C#" runat="server"> protected string[] _hiddenPropertiesDelimiter; protected TextBox _tb; const int TARGETID = 0; // Index for this info within an array. const int TOP = 1; const int LEFT = 2 ; protected void Page_Load(object sender, EventArgs e) { _hiddenPropertiesDelimiter = new string[1] {"+"}; if (!Page.IsPostBack) { DatePicker.Attributes.CssStyle["visibility"] = "hidden"; } } protected void DatePicker_SelectionChanged(object sender, System.EventArgs e) { ResetCalendarProperties("hidden"); if (_tb != null) { _tb.Text = DatePicker.SelectedDate.ToShortDateString(); } } protected void DatePicker_VisibleMonthChanged(object sender, MonthChangedEventArgs e) { ResetCalendarProperties("visible"); } protected void ResetCalendarProperties(string hideFlag) { HtmlInputHidden hiddenCalendarProperties = (HtmlInputHidden)Page.FindControl("hiddenCalendarProperties"); if (hiddenCalendarProperties != null) { string[] hiddenTargetStringArray = hiddenCalendarProperties.Value.Split(_hiddenPropertiesDelimiter, StringSplitOptions.None); string targetID = hiddenTargetStringArray[TARGETID]; _tb = (TextBox)Page.FindControl(targetID); DatePicker.Attributes.CssStyle["Top"] = hiddenTargetStringArray[TOP]; DatePicker.Attributes.CssStyle["Left"] = hiddenTargetStringArray[LEFT]; DatePicker.Attributes.CssStyle["visibility"] = hideFlag; } } </script> </head> <body> <form id="Form1" method="post" runat="server"> <asp:Calendar ID="DatePicker" Style="z-index: 999; left: 340px; position: absolute; top: 133px" runat="server" OnSelectionChanged="DatePicker_SelectionChanged" BackColor="White" BorderColor="#999999" CellPadding="4" DayNameFormat="Short" Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" Height="180px" Width="200px" OnVisibleMonthChanged="DatePicker_VisibleMonthChanged"> <SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" /> <TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" /> <SelectorStyle BackColor="#CCCCCC" /> <WeekendDayStyle BackColor="#FFFFCC" /> <OtherMonthDayStyle ForeColor="#808080" /> <NextPrevStyle VerticalAlign="Bottom" /> <DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" /> <TitleStyle BackColor="#999999" BorderColor="Black" Font-Bold="True" /> </asp:Calendar> <asp:Label ID="Label17" Style="z-index: 101; left: 47px; position: absolute; top: 53px" runat="server" Font-Size="X-Small" Font-Names="Arial">From: </asp:Label> <asp:TextBox ID="txtFromDate" Style="z-index: 102; left: 85px; position: absolute; top: 53px" runat="server" Width="112px" onblur="HideCalendar('DatePicker')" /> <asp:Label ID="Label1" Style="z-index: 103; left: 47px; position: absolute; top: 83px" runat="server" Font-Size="X-Small" Font-Names="Arial">To: </asp:Label> <asp:TextBox ID="txtToDate" Style="z-index: 104; left: 85px; position: absolute; top: 83px" runat="server" Width="112px" /> <input id="buttonShowCalendar1" style="z-index: 108; left: 202px; position: absolute; top: 52px" type="button" value="..." language="javascript" onclick="DisplayCalendar(this, 'DatePicker', 'txtFromDate')" /> <input id="buttonShowCalendar2" language="javascript" style="z-index: 111; left: 203px; position: absolute; top: 83px" onclick="DisplayCalendar(this, 'DatePicker', 'txtToDate')" type="button" value="..." /> <asp:CompareValidator Style="z-index: 105; left: 231px; position: absolute; top: 55px" ControlToValidate="txtFromDate" Display="Dynamic" ErrorMessage="Date?" ID="CompareValidator1" Operator="DataTypeCheck" runat="server" Type="Date">Date?</asp:CompareValidator> <asp:CompareValidator Style="z-index: 106; left: 233px; position: absolute; top: 88px" ControlToValidate="txtToDate" Display="Dynamic" ErrorMessage="Date?" ID="CompareValidator2" Operator="DataTypeCheck" runat="server" Type="Date">Date?</asp:CompareValidator> <asp:Button Style="z-index: 107; left: 88px; position: absolute; top: 119px" ID="Button1" runat="server" Text="Button" /> <input id="hiddenCalendarProperties" type="hidden" value="" runat="server" style="z-index: 110; left: 412px; position: absolute; top: 31px" /> </form> </body> </html>