Calendar Demonstration

Default calendar:

(Set the focus to the textbox to show the calendar)

Calendar with a custom style and formatted date:

(Set the focus to the textbox to show the calendar)

Calendar with an associated button:

(Click the image button to show the calendar; this calendar dismisses automatically when you choose a date)

Calendar Description

Calendar is an ASP.NET AJAX extender that can be attached to any ASP.NET TextBox control. It provides client-side date-picking functionality with customizable date format and UI in a popup control. You can interact with the calendar by clicking on a day to set the date, or the "Today" link to set the current date.

In addition, the left and right arrows can be used to move forward or back a month. By clicking on the title of the calendar you can change the view from Days in the current month, to Months in the current year. Another click will switch to Years in the current Decade. This action allows you to easily jump to dates in the past or the future from within the calendar control.

Calendar Properties

The calendar associated with a button has been initialized with this code. The properties in italic are optional:

<ajaxToolkit:Calendar runat="server"
    TargetControlID="Date1"
    CssClass="ClassName"
    Format="MMMM d, yyyy"
    PopupButtonID="Image1" />

TargetControlID - The ID of the TextBox to extend with the calendar.
CssClass - Name of the CSS class used to style the calendar.
Format - Format string used to display the selected date.
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.