Selection
The Calendar enables the user to make single, multiple, range-date, and week selections.
For a runnable example, refer to the demo on multiple selection in the Calendar component.
Single Date Selection
By default, the Calendar enables the user to select a single date by using the mouse or the keyboard.
As of the 2022 R3 release, the
Changeevent will now be fired only when Selection/Deselection is performed.
Multiple Date Selection
As of the 2017 R3 release, the Calendar allows you to implement the multiple date selection by using the selectable configuration property.
To perform the multiple date selection, the user can also use the keyboard:
-
Ctrl+ mouse-clicking a specific date—Marks the date as selected. Other previously selected dates remain selected. - The selection of a date from a specific view without utilizing the
Ctrlkey selects the date of the clicked cell and deselects all previously selected dates including the previously selected dates from other views or months. - The selection of a date that is already selected while holding the
Ctrlkey removes the date from the selection.
@(Html.Kendo().Calendar()
.Name("calendar")
.Selectable("multiple")
)
<kendo-calendar name="calendar" selectable="multiple">
</kendo-calendar>
Range Date Selection
The Calendar enables the range date selection over the keyboard.
The usage of the Shift key allows the user to select a range of dates in the same month or across different months:
-
Shift+ mouse-clicking specific dates—Selects all dates between the most recently selected one (withSpaceor mouse click) and the clicked cell. -
Shift+ mouse clicking specific dates—If no previous selection was made, selects all dates from the beginning to the clicked cell.
Week Selection
When the user clicks a specific week number, the Calendar selects the entire week. The week selection functionality is a special case of range selection which starts from the first day of the week and selects all dates to the end of the week.