New to KendoReact? Start a free 30-day trial
Keyboard Navigation
Managing the Focus
Focus goes through the two date inputs. The popup becomes the active element when it is opened, but it is not the focused element at any point.
Keyboard Shortcuts
Actions applied to the DateInput:
The DateRangePicker implements the keyboard shortcuts for the DateInput component:
Apart from that, it also features the following shortcuts related to ist Popup:
| Shortcut | Behavior |
|---|---|
Esc | Closes the popup |
Alt/Opt(Mac) + Down | Opens the popup |
Alt/Opt(Mac) + Up | Closes the popup |
Actions applied to the Calendar:
Ones the popup is open, navigation is handled through the MultiViewCalendar component:
MultiViewCalendar specification
Resources
ARIA Authoring Practices: Date Picker Dialog
Change Theme
Theme
Loading ...
Navigation Scenarios
When the popup of the DateRangePicker is opened, it adopts the same keyboard shortcuts as the keyboard shortcuts of the MultiViewCalendar.
When the inputs of the DateRangePicker is focused, it adopts the same keyboard shortcuts as the keyboard shortcuts of the DateInput.