Calendar - Overview

The Calendar component allows users to select dates and navigate through months and years.

Sun Mon Tue Wed Thu Fri Sat
23 31 1 2 3 4 5 6
24 7 8 9 10 11 12 13
25 14 15 16 17 18 19 20
26 21 22 23 24 25 26 27
27 28 29 30 1 2 3 4
28 5 6 7 8 9 10 11

Calendar - Multiple Selection

In this demo module, the Calendar component allows you to select several dates simultaneously. Click a date while you press Ctrl to add a date to the selection.

Sun Mon Tue Wed Thu Fri Sat
23 31 1 2 3 4 5 6
24 7 8 9 10 11 12 13
25 14 15 16 17 18 19 20
26 21 22 23 24 25 26 27
27 28 29 30 1 2 3 4
28 5 6 7 8 9 10 11

Calendar - Disabled Dates

In this demo module, a few Calendar dates are grayed out (disabled) and cannot be selected. The CustomDisabledDate event allows you to disable selection of specific dates based on custom logic.

Sun Mon Tue Wed Thu Fri Sat
23 31 1 2 3 4 5 6
24 7 8 9 10 11 12 13
25 14 15 16 17 18 19 20
26 21 22 23 24 25 26 27
27 28 29 30 1 2 3 4
28 5 6 7 8 9 10 11

Calendar - Day Cell Customization

Use the calendar’s DayCellTemplate property to customize day cells.

Sun Mon Tue Wed Thu Fri Sat
23 31 1 2 3 4 5 6
24 7 8 9 10 11 12 13
25 14 15 16 17 18 19 20
26 21 22 23 24 25 26 27
27 28 29 30 1 2 3 4
28 5 6 7 8 9 10 11