Display a one-month calendar for user selection

The value property gets or sets the currently selected date. The min and max properties restrict the range of dates that the user can select. Or, use the selectionMode property to determine whether users should be allowed to select days, months, or no values at all.

Try the demo

Calendar Ranges

Use the Calendar's min and max properties to restrict the range of dates that can be entered.

Try the demo


Customize the appearance of the whole calendar using CSS, and use the calendar's formatItem event to customize the appearance of specific dates.

Try the demo


The Calendar control prevents users from selecting values outside the range determined by the min and max properties.

To handle invalid input, the Calendar control has an itemValidator property. This property represents a function that takes a date as a parameter and returns true if the date is valid for selection, or false otherwise.

Try the demo

JavaScript Calendar Year Picker

Year Picker

Click on the year header to open a handy year picker allowing you to jump across years in the Calendar control.