Help us shape the 2021 DevExtreme Roadmap. Take our 5 minute survey.

Keyboard Support

A user can interact with the UI component using the following keys:

Key Action
← → ↑ ↓
  • Navigates through cells if no cell is in the editing state.
  • In the editing state, moves cursor inside the cell or increases/decreases the cell value (depending on the editor).
Shift + Mouse Wheel Scrolls the content left/right if the horizontal scrolling is taking place.
  • Switches a cell to the editing state.1
  • Moves focus to the next cell.2
  • Saves changes made in a cell or row and switches it back to its normal state.
F2 Switches a cell to the editing state.3
Esc Cancels changes made in a cell or row and switches it back to its normal state.
Alt + ↓ Opens a drop-down editor (a select box4, a calendar5, etc.) in the editing state.
Space Selects the focused row and clears the selection of previously selected rows.3
Ctrl + ← → ↑ ↓ Navigates between the headers, filter panel, filter row, data area, and pager.
Ctrl + Space or Ctrl + Click Selects or clears the selection of the focused row.
Previously selected rows remain selected.7
Shift + Space or Shift + Click Selects or clears the selection of a range of rows between the last selected or deselected and the focused rows.7,8
Ctrl + A Selects all rows.6,9
Ctrl + F Focuses the search panel.10
PageUp / PageDown Navigates to the previous/next page.
Tab / Shift + Tab Moves the focus one cell forward/back.
Focuses the first/last cell in the next/previous row if cells in the current row run out.
Shift + Click / Ctrl + Click
on a column header
Applies/clears sorting settings of the column.11
  1. If the enterKeyAction is "startEdit".
  2. If the edititng.mode is "cell" or "batch" and the enterKeyAction is "moveFocus".
  3. The editing.mode should be "cell" or "batch".
  4. A select box appears in a cell of a lookup column.
  5. A calendar appears in a data cell when a column contains "date" type data.
  6. The selection.mode should be different from "none".
  7. The selection.mode should be "multiple".
  8. If the scrolling.mode is "virtual", the rows should be visible simultaneously. If the mode is "standard", the rows should be on one page.
  9. selection.allowSelectAll should be true.
  10. The search panel should be visible.
  11. The sorting.mode should be "multiple".

You can override these shortcuts or create your own shortcuts using the onKeyDown event handler.