Ajax Calender control:

Ajax Calender Control is an asp.net control associated with Textbox. When the user clicks on the textbox it pops up. It provides client-side date-picking functionality with customizable date format and UI in a popup control. The user can then set a date by clicking on a day, navigate months by clicking on the left and right arrow and perform other such actions without a postback.

How to use Ajax Calender control in Asp.net

1)     In Aspx Page add one TextBox id is txtDate  and Ajax Calender control.

2)    Sample Code :

<%@ Register Assembly=”AjaxControlToolkit” Namespace=”AjaxControlToolkit” TagPrefix=”cc1” %> //add this

<asp:TextBox ID=”txtDate” runat=”server” ></asp:TextBox>

<cc1:CalendarExtender ID=”CalendarExtender1″ runat=”server” PopupButtonID=”txtDate” Format=”dd/MM/yyyy”             TargetControlID=”txtDate”> </cc1:CalendarExtender>

1)       TargetControlID – The ID of the Textbox to extend with the calendar.

(In Our Example TargetControlID is txtDate)

2)       CssClass – Name of the CSS class used to style the calendar. See the Calendar Theming section for more information.

3)     Format – Format string used to display the selected date.

Formats:       “dd/MM/yyyy”

           "MMMM d, yyyy"

4)    PopupButtonID – The ID of a control to show the calendar popup when clicked. If this value is not set, the calendar will pop up when the textbox receives focus.

(In Our Example PopupControlID  is txtDate)

5)       PopupPosition – Indicates where the calendar popup should appear at the BottomLeft(default), BottomRight, TopLeft, TopRight, Left or Right of the TextBox.

Explaination: When user clicks in TextBox (txtDate), the ajax calendar control will popup and the selected date will be displayed in TextBox (txtDate)