JavaScript/jQuery DataGrid - Accessibility

Accessibility Features Overview

NOTE

The overall accessibility level of your application depends on the DataGrid features that you use.

Accessibility Requirement	Support Level
Right-to-Left Support
Keyboard Navigation Support
Screen Reader Support
Contrast Color Theme
Mobile Device Support
Lighthouse Accessibility Validation
Axe Accessibility Validation
WAVE Accessibility Validation
Section 508 Support
WCAG 2.x Support

The DataGrid component meets a variety of Section 508 and WCAG 2.x compliance standards. Known exceptions:

Section 508 criteria	WCAG 2.x criteria	Exception description
501 (Web)(Software) 504.2 (Authoring Tool) 602.3 (Support Docs)	1.1.1 Non-text Content (Level A)	Drag icons do not have `alt` and aria-label attributes.
501 (Web)(Software) 504.2 (Authoring Tool) 602.3 (Support Docs)	1.3.1 Info and Relationships (Level A)	The filter menu button in filter row does not supply any accessibility information.
501 (Web)(Software) 504.2 (Authoring Tool) 602.3 (Support Docs)	1.4.3 Contrast (Minimum) (Level AA) 1.4.11 Non-text Contrast (Level AA 2.1 and 2.2)	DataGrid does not support Windows High Contrast themes.
11.5.2.12 Execution of available actions	2.1.1 Keyboard (Level A)	Keyboard navigation is not supported for ColumnChooser items in 'drag' mode.
-	2.4.11 Focus Not Obscured (Minimum) (Level AA 2.2 only)	ColumnChooser and HeaderFilter in DataGrid do not meet this criterion.
-	2.5.7 Dragging Movements (Level AA 2.2 only)	ColumnChooser in 'drag' mode.
-	2.5.8 Target Size (Minimum) (Level AA 2.2 only)	Command buttons and icons.
11.5.2.15 Change notification	4.1.3 Status Messages (Level AA 2.1 and 2.2)	DataGrid summaries when recalculateWhileEditing is enabled.
504.2.2 PDF Export	-	If you export a DataGrid to PDF, the following issues occur in the resulting document: No document ‘title’ tag. Pictures are exported without ‘alt’ attributes. Pages do not have language settings. Languages of individual phrases also cannot be set at the grid export level. No tags for table structures.

DataGrid offers different keyboard controls depending on which action users want to perform.

NOTE

The Ctrl+Home and Ctrl+End shortcuts are not supported in DataGrid components with:

Key	Action
← → ↑ ↓	Moves focus between cells.
Tab Shift + Tab	Moves focus forward/backward between all DataGrid items.
Ctrl + ↑ Ctrl + ↓	Moves focus between the component's areas, such as the data area, column headers area, group panel, and others.
Shift + Mouse Wheel	Scrolls content left/right if horizontal scrolling is active.
Enter	When focused on a cell, moves focus to the next cell if keyboardNavigation.enterKeyAction is "moveFocus". The next cell is determined by keyboardNavigation.enterKeyDirection.
Home End	Moves focus to the first/last cell of the current row.
Ctrl + Home Ctrl + End	Moves focus to the first cell of the first row/last cell of the last row.
PageUp PageDown	Navigates to the component's previous/next page.
Ctrl + F	When focused on a cell, moves focus to the search panel if searchPanel.visible is "true".

Key	Action
Enter Space	When focused on a column header, enables/cycles between sorting options (ascending/descending).
Shift + Enter Shift + Space Shift + Click	Enables/cycles focused column sorting without clearing previous sorting options if sorting.mode is "multiple".
Ctrl + Enter Ctrl + Space Ctrl + Click	Disables focused column sorting. Does not clear previous sorting options if sorting.mode is "multiple".
Ctrl + → Ctrl + ←	Moves the focused column header right/left if columns[].allowReordering is enabled.

Key	Action
Ctrl + G	Groups data by focused column values if columns[].allowGrouping is enabled.
Shift + Ctrl + G	Ungroups data by focused column values.
Delete Backspace	When focused on column headers in the group panel, ungroups data by focused column values.
Ctrl + → Ctrl + ←	Moves the focused column header right/left in the group panel to change group hierarchy.
Shift + Alt + G	Ungroups data by all column values.

Key	Action
Enter	When focused on a cell in normal mode, switches the component to edit mode if keyboardNavigation.enterKeyAction is "startEdit". When focused on a cell in edit mode, saves changes and switches the component to normal mode. When focused on a button in a command column, triggers the focused command button.
F2	When focused on a cell in normal mode, switches the component to edit mode unless the focused cell's editing.mode is "popup".
Alt + ↓	Opens drop-down editors such as select boxes in edit mode.
← → ↑ ↓	When focused on a cell in edit mode, moves the cursor in the focused cell or increases/decreases its value.
Esc	When in edit mode, cancels unsaved changes and switches to normal mode.

Key	Action
Space	Selects the focused cell's row and clears the previous selection if selection.mode is "multiple" or "single" and selection.showCheckBoxesMode is "none", "onClick", or "onLongTap". Does not clear previous selection if selection.showCheckBoxesMode is "always".
Ctrl + Space Ctrl + Click	Toggles selection of the focused cell's row without clearing previous selection.
Shift + Space Shift + Click	Selects all items between the last selected row and the focused cell's row if selection.mode is "multiple".
Ctrl + A	Selects all rows if selection.mode is "multiple" and selection.allowSelectAll is "true".

You can override these shortcuts or create your own. Refer to the following help topic for more information: Custom Keyboard Navigation.

The DataGrid component supports screen readers and complies to WAI-ARIA standards. Known exceptions are listed in the Accessibility Standards Compliance topic.