Expand All

Basics

Formatting

Context menu

Drag n Drop

Spreadsheet

Tabs

Export

Layouts

RTL Layout

Rows

Paging

Big data

Columns

Cells

Inline editing

Row Grouping

Pivot

Sorting

Filter

Selections

Nesting / Row details

Tree grid

Charts

Angular

React React

Vue Vue

Knockout

;

Key navigation in jQuery grid

1. Header Cell Navigation

  • Tab: Moves focus sequentially across header cells from left to right. If focus is on the last header cell, it moves into the first filter cell (if enabled) or down into the first data row.
  • Shift + Tab: Moves focus backward through header cells from right to left.
  • Left / Right Arrow: Navigates between adjacent header cells when the header row is focused.
  • Enter / Spacebar: Triggers sorting on the focused header column. Pressing it repeatedly cycles through Ascending, Descending, and Unsorted states.

2. Header Filter Cell Navigation

  • Arrow Keys (Left / Right): Moves the text cursor within the filter input box. If the input is empty or the cursor reaches the boundary, it shifts focus to the adjacent filter cell.
  • Tab: Moves focus to the next filter input cell to the right. If it is the last filter cell, it shifts focus down into the main data grid cells.
  • Shift + Tab: Moves focus to the previous filter input cell to the left. If it is the first filter cell, it shifts focus up into the column headers.
  • Enter: Executes the filter criteria on the grid data immediately and closes any active filter dropdown pickers.
  • Esc: Resets and clears the current input value in the active filter cell, returning the grid column to an unfiltered state.

3. Data Cell Navigation & Editing

  • Arrow Keys (Up / Down / Left / Right): Moves the active cell focus in the respective direction. If a cell is currently in edit mode, the Left and Right arrows navigate the text cursor inside the editor instead of changing cell selection.
  • Tab: Moves focus to the next data cell to the right. If focus rests on the final cell of a row, it wraps around to the first cell of the following row.
  • Shift + Tab: Moves focus to the previous data cell to the left. If focus rests on the first cell of a row, it wraps back to the last cell of the preceding row.
  • Enter: Opens the cell editor if the cell is currently selected. If the cell is already in edit mode, it saves the changes, exits the editor, and shifts focus down to the cell immediately below.
  • Esc: Aborts the current editing session, discarding any newly entered data and reverting the cell to its original value.

4. Grid View & Selection Controls

  • Home: Instantly jumps the selection focus to the first cell of the currently active row.
  • End: Instantly jumps the selection focus to the last cell of the currently active row.
  • Page Up: Scrolls the viewport upward and moves cell selection up by a full visible page.
  • Page Down: Scrolls the viewport downward and moves cell selection down by a full visible page.
  • Ctrl + Home: Teleports selection focus to the very first cell of the first row in the grid.
  • Ctrl + End: Teleports selection focus to the very last cell of the last row in the grid.
  • Spacebar: Toggles row selection status or checkbox selection when the focus hits a checkbox column or when row selection mode is explicitly enabled.
  • Shift + Arrow Keys: Expands or contracts the boundary of selected cells or rows in the direction of the pressed arrow key, enabling multi-cell blocks to be selected.