Touch Information
| Target | Gesture | Action |
|---|---|---|
| Cell | Tap | Focus on the cell. If selectionMode for cells is enabled, selects the cell as well.
If multiple selection is enabled the selection handles will appear. Tapping a different cell will deselect the previous selection. |
| Press & Hold | Display context menu | |
| Row | Tap | If selectionMode for rows is enabled, selects the row as well.
If multiple selection is enabled the selection handles will appear. Tapping a different row will deselect the previous selection. |
| Drag | If the row that is dragged contains the active cell and dnd reorder row is enabled the row will be moved within the DataGrid. |
|
| Press & Hold | Display context menu | |
| Header | Tap | If Multiple Selection is enabled or in row selectionMode, the row or column will be selected. Selection handles will appear for multiple selection. Otherwise, header cell will be focused. |
| Press & Hold | Display context menu | |
| Header Gridline | Drag | Resizes the header if resizable enabled along the axis. |
| Corner | Tap | Tapping on the corner will perform a select all operation on the datagrid if multiple selection is enabled. |
Keyboard Information
| Target | Key | Action |
|---|---|---|
| Cell | Tab | The first Tab into the DataGrid moves focus to the first cell of the first row. The second Tab moves focus to the next focusable element outside of the DataGrid. |
| Shift + Tab | The first Shift + Tab into the DataGrid moves focus to the first cell of the first row. The second Shift + Tab moves focus to the previous focusable element outside of the DataGrid. | |
| LeftArrow | Moves focus to the cell of the previous column within the current row. There is no wrapping at the beginning or end of the columns. If a row header is present, then the row header next to the first column of the current row will gain focus. | |
| RightArrow | Moves focus to the cell of the next column within the current row. There is no wrapping at the beginning or end of the columns. | |
| UpArrow | Moves focus to the cell of the previous row within the current column. There is no wrapping at the beginning or end of the rows. If a column header is present, then the column header above the first row of the current column will gain focus. | |
| DownArrow | Moves focus to the cell of the next row within the current column. There is no wrapping at the beginning or end of the rows. | |
| Home | Moves focus to the first (available) cell of the current row. | |
| End | Moves focus to the last (available) cell of the current row. | |
| PageUp | Moves focus to the first (available) cell in the current column. | |
| PageDown | Moves focus to the last (available) cell in the current column. | |
| Ctrl + Space | Selects all the cells of the current column. This is only available if multiple cell selection mode is enabled. | |
| Shift + Space | Selects all the cells of the current row. This is only available if multiple cell selection mode is enabled. | |
| Shift + Arrow | Extends the current selection. | |
| Ctrl + Arrow | Move focus to the start or end cell in a contiguous data range in the direction of the arrow, i.e. if there is an empty cell, focus moves to the cell adjacent to empty cell. An empty cell is defined as a cell with no children or text content inside the cell.
If the end of the rendered data range is reached, that will be where the focus moves to, new data will be fetched, and another keyboard gesture will be required to keep searching |
|
| Ctrl + Home | Move focus to the first (available) cell of grid | |
| Ctrl + End | Move focus to the last (available) cell of grid | |
| Shift + F8 | Freezes the current selection, therefore allowing user to move focus to another location to add or remove additional cells to the current selection. To deselect begin the discontiguous selection within an existing selection. This is used to accomplish non-contiguous selection. Use the Esc key or press Shift+F8 again to exit this mode. | |
| Shift + F10 | Brings up the context menu. | |
| Ctrl + C | It triggers ojCopyRequest with the selected range of cells. Only a single range may be copied. | |
| Ctrl + X | Marks the current row to move if dnd is enabled and the datasource supports move operation. If datasource is datagridProvider, It triggers ojCutRequest with the selected range of cells. Only a single range may be cut. | |
| Ctrl + V | Move the row that is marked to directly under the current row. If the row with the focused cell is the last row, then it will be move to the row above the current row. If datasource is datagridProvider, it triggers ojPasteRequest with the selected range of cells. Investigate the source selection/action to determine how to handle the paste operation. | |
| Ctrl + A | If multiple selection is enabled, performs a select all on the datagrid. | |
| Ctrl + Alt + 5 | Read the context and content of the current cell to the screen reader. | |
| F2 | Makes the content of the cell actionable, such as a link. | |
| Enter | Makes the content of the cell actionable and acts on the content, such as going to a link. | |
| Alt + Enter | Makes the content of the cell actionable, such as a link. | |
| Esc | If the cell is actionable it exits actionable mode. | |
| Column Header Cell | LeftArrow | Moves focus to the previous column header. There is no wrapping at the beginning or end of the column headers. |
| RightArrow | Moves focus to the next column header. There is no wrapping at the beginning or end of the column headers. | |
| DownArrow | Moves focus to the cell of the first row directly below the column header. If using nested headers will move focus up a level. | |
| UpArrow | If using nested headers will move focus down a level. | |
| Ctrl + UpArrow | If in the column end header, move focus to upside in a contiguous data range including the level 0 of the active index in the column header if it exists.
If there is an empty cell in between, focus moves to the cell adjacent to empty cell. An empty cell is defined as a cell with no children or text content inside the cell. If the end of the rendered data range is reached, that will be where the focus moves to, new data will be fetched, and another keyboard gesture will be required to keep searching |
|
| Ctrl + LeftArrow | On an expanded parent column header, collapses the header. | |
| Ctrl + RightArrow | On a collapsed parent column header, expands the header. | |
| Ctrl + DownArrow | If in the column header, move focus to down side in a contiguous data range including level 0 of the active index in the column end header if it exists.
If there is an empty cell in between, focus moves to the cell adjacent to empty cell. An empty cell is defined as a cell with no children or text content inside the cell. If the end of the rendered data range is reached, that will be where the focus moves to, new data will be fetched, and another keyboard gesture will be required to keep searching |
|
| Enter | Toggle the sort order of the column if the column is sortable. | |
| Shift + F10 | Brings up the context menu. | |
| Space | If multiple selection is enabled and not in selectionMode row, the column(s) underneath the header will be selected. |
|
| Shift + Right Arrow | If multiple selection is enabled and not in selectionMode row, the column selection will extend to the right by the number of columns covered by the header to the right of the current selection frontier header. |
|
| Shift + Left Arrow | If multiple selection is enabled and not in selectionMode row, the column selection will extend to the right left the number of columns covered by the header to the left of the current selection frontier header. |
|
| Shift + Up Arrow | If multiple selection is enabled and not in selectionMode row and the current selection frontier header has a parent nested header, the column selection will extend to cover the columns beneath the parent header.
Extending the selection with arrow keys will use the parent level. If the parent header is directly above the anchor header, the anchor will shift to the parent header and future selections will be based on the parent header. If we are already at the highest level, nothing will happen. |
|
| Shift + Down Arrow | If multiple selection is enabled and not in selectionMode row and the current selection frontier header has a child nested header, the column selection will extend to cover the columns beneath the child header.
Extending the selection with arrow keys will use the child level. If the child header is directly below the anchor header, the anchor will shift to the child header and future selections will be based on the child header. If we are already at the lowest level, it will simply move into the databody and select the first cell underneath the header. |
|
| Row Header Cell | UpArrow | Moves focus to the previous row header. There is no wrapping at the beginning or end of the row headers. |
| DownArrow | Moves focus to the next row header. There is no wrapping at the beginning or end of the row headers. | |
| RightArrow | Moves focus to the cell of the first column directly next to the row header. If using nested headers will move focus up a level. | |
| LeftArrow | Moves focus to the cell of the first column directly next to the row header in RTL direction. If using nested headers will move focus down a level. | |
| Ctrl + LeftArrow | If inside header and hierarchical header will expand, if expanded or not hierarchical,
move focus to left side in a contiguous data range (including the row header). if there is an empty cell in between, focus moves to the cell adjacent to empty cell. An empty cell is defined as a cell with no children or text content inside the cell. If the end of the rendered data range is reached, that will be where the focus moves to, new data will be fetched, and another keyboard gesture will be required to keep searching |
|
| Ctrl + RightArrow | If inside header and hierarchical header will expand, if expanded or not hierarchical,
move focus to right side in a contiguous data range (including the row End header). if there is an empty cell in between, focus moves to the cell adjacent to empty cell. An empty cell is defined as a cell with no children or text content inside the cell. If the end of the rendered data range is reached, that will be where the focus moves to, new data will be fetched, and another keyboard gesture will be required to keep searching |
|
| Enter | Toggle the sort order of the row if the row is sortable. | |
| Shift + F10 | Brings up the context menu. | |
| Space | If multiple selection is enabled, the row(s) underneath the header will be selected. | |
| Shift + Up Arrow | If multiple selection is enabled, the row selection will extend up by the number of rows covered by the header above the current selection frontier header. | |
| Shift + Down Arrow | If multiple selection is enabled, the row selection will extend down by the number of rows covered by the header below the current selection frontier header. | |
| Shift + Left Arrow | If multiple selection is enabled and the current selection frontier header has a parent nested header, the row selection will extend to cover the rows beneath the parent header.
Extending the selection with arrow keys will use the parent level. If the parent header is directly above the anchor header, the anchor will shift to the parent header and future selections will be based on the parent header. If we are already at the highest level, nothing will happen. |
|
| Shift + Right Arrow | If multiple selection is enabled and the current selection frontier header has a child nested header, the row selection will extend to cover the rows beneath the child header.
Extending the selection with arrow keys will use the child level. If the child header is directly below the anchor header, the anchor will shift to the child header and future selections will be based on the child header. If we are already at the lowest level, it will simply move into the databody and select the first cell underneath the header. |