Calendar Extender Today’s Date

The following is a simple code to show how to set/highlight the selected date in a Calendar Extender as Today’s Date. I am using JavaScript to set the Calendar’s date. Here is the code:

Aspx:

   1: <asp:ToolkitScriptManager ID="toolKitScriptManger" runat="server" />
   2: <asp:TextBox  ID="txtCalender" runat="server" />  
   3: <asp:ImageButton ID = "imgCalender"  runat="server" ImageUrl="~/calendar.gif"/>
   4: <asp:CalendarExtender  ID="calenderExtender" runat="server"  CssClass="cal_theme" TargetControlID="txtCalender"  
   5:         PopupButtonID="imgCalender" OnClientShowing="CurrentDateShowing"/>   

In the above code I am calling Javascript function CurrentDateShowing on the CalendarExtender which set’s Today’s Date.

Here is the Javascript and a css class which I use on the Calendar Extender.

Css:

   1: .cal_theme .ajax__calendar_active    
   2:   {      
   3:       color: Red;       
   4:       font-weight: bold;       
   5:       background-color: #ffffff;  
   6:   } 

 

JavaScript:

   1: <script type="text/javascript">
   2:    function CurrentDateShowing(e) 
   3:    {
   4:        if (!e.get_selectedDate() || !e.get_element().value)
   5:            e._selectedDate = (new Date()).getDateOnly();
   6:    }     
   7:    </script>

On using the above code when the Calendar pops up on the Image Button Click you would see Today’s date is highlighted in Red.

4 Comments

Comments have been disabled for this content.