Components / Date Inputs / DatePicker

Keyboard Navigation

The keyboard navigation of the DatePicker is always available.

The DatePicker supports the following keyboard shortcuts:

Shortcut Description
Alt+Down Arrow Opens the popup and moves the focus to the displayed calendar.
Alt+Up Arrow Closes the popup and moves the focus to the input element.
Up/Down/Left/Right Arrow Selects the adjacent date in the specified direction.
Page Up Scrolls to the previous month.
Page Down Scrolls to the next month.
Esc Discards the selection and closes the calendar.
Enter Accepts the selected date and closes the calendar. 
@Component({
    selector: 'my-app',
    template: `
        <div class="example-wrapper">
            <kendo-datepicker
                [value]="value"
            ></kendo-datepicker>
        </div>
    `
})

class AppComponent {
    public value: Date = new Date(2000, 2, 10);
}

Navigation Scenarios

When the popup of the DatePicker is opened, it adopts the same keyboard shortcuts as the keyboard shortcuts of the Calendar.

When the input of the DatePicker is focused, it adopts the same keyboard shortcuts as the keyboard shortcuts of the DateInput.

In this article