Using the Keyboard with Data Collections
This topic describes examples of how to use keyboard shortcuts to navigate within the various collections, such as tables and lists, and select actionable items.
Tables
This section describes how to navigate within tables appearing on a page. The example below uses the Country table for illustration.
Target |
Key |
Description |
---|---|---|
Cell |
Tab |
The first Tab into the table moves focus to the first column header. The second Tab moves focus to the next focusable element outside of the table. If focus is on a row and the row has been placed in actionable mode using the F2 key, then Tab moves focus to the next focusable element within the row. If focus is already on the last focusable element, then focus will wrap to the first focusable element in the row. |
Shift+Tab |
The first Shift+Tab into the table moves focus to the first column header. The second Shift+Tab moves focus to the previous focusable element outside of the table. If focus is on a row and the row is actionable, then Shift+Tab moves focus to the previous focusable element within the row. If focus is already on the first focusable element, then focus will wrap to the last focusable element in the row. |
|
Down Arrow |
Move focus to the next row. |
|
Shift+Down Arrow |
Select and move focus to the next row. |
|
Up Arrow |
Move focus to the previous row. If at the first row, then move to the column header. |
|
Shift+Up Arrow |
Select and move focus to the previous row. |
|
Home |
Move focus to first row. |
|
End |
Move focus to last row. |
|
Space |
If chevron icon is used, drill down to the detail. |
|
Enter |
Toggle the current row to actionable mode if there exists a tabbable element in the row. Once toggled to actionable mode, focus will be moved to be first tabbable element in the row. |
|
F2 |
Toggle the current row to actionable mode if there exists a tabbable element in the row. |
|
Column Header |
Tab |
Navigate to next focusable element on page (outside table). |
Shift+Tab |
Navigate to previous focusable element on page (outside table). |
|
Down Arrow |
Move focus to the first row. |
|
Left Arrow |
Move focus to previous column header. |
|
Right Arrow |
Move focus to next column header. |
|
Home |
Move focus to first column header. |
|
End |
Move focus to last column header. |
|
Space |
Select column. |
List View
This section describes how to navigate within tables appearing on a page. The example below uses the Country table for illustration.
Target |
Key |
Description |
---|---|---|
List Item |
F2 |
Enters Actionable mode. This enables keyboard action on elements inside the item, including navigation between focusable elements inside the item. |
Esc |
Exits Actionable mode. |
|
Tab |
When in Actionable Mode, navigates to next focusable element within the item. If the last focusable element is reached, shift focus back to the first focusable element. When not in Actionable Mode, navigates to next focusable element on page (outside ListView). |
|
Shift+Tab |
When in Actionable Mode, navigates to previous focusable element within the item. If the first focusable element is reached, shift focus back to the last focusable element. When not in Actionable Mode, navigates to previous focusable element on page (outside ListView). |
|
Down Arrow |
Move focus to the item below. |
|
Up Arrow |
Move focus to the item above. |
|
Left Arrow |
When display in card layout, move focus to the item on the left. |
|
Right Arrow |
When display in card layout, move focus to the item on the right. |
|
Shift+F10 |
Launch the context menu if there is one associated with the current item. |
|
Enter |
Selects the current item, unless the item is already selected. |