New to Kendo UI for Vue? Start a free 30-day trial
Keyboard Navigation
The keyboard navigation of the Grid can be enabled using the navigatable prop of the Grid.
The Grid supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Arrow keys | Navigates through the cells of the Grid |
Enter | Will perform different actions based on the current cell. For example, it will sort a sortable column, expand/collapse a parent item, or if focusable nested component is available it will exit navigation and focus it. |
Esc | Will return to the Grid navigation if the user is currently inside editor or filter component navigation. For example, when inside a NumericTextBox editor, pressing Arrow up will increase the value, but pressing Esc will return to the cell level navigation and allow the end-user to move across the cells. |
Change Theme
Theme
Loading ...
Custom Cells and Keyboard Navigation
In cases when we have custom cells we need to inject the internal getKeyboardNavigationAttributes method and the id prop of the cell and use them to have the correct attributed for the td element and to include it in the navigation logic.
Change Theme
Theme
Loading ...