R2 2018 Release is here – now with modern UI for chatbots and more! See what’s new!
Change Theme

SASS Themes

    LESS Themes

      SASS Theme Builder

      Create new or customize SASS themes
      Launch Theme Builder

      Grid / Keyboard navigation

      Focus

      • Alt + w focuses the widget

      Actions applied on Grid header

      • Enter sort by the column
      • Alt + Down opens the filter menu
      • Esc closes the filter menu
      • Tab navigates through the elements in the filter menu(default browser behavior)
      • Shift + Tab same as Tab, but in reverse order
      • Ctrl + Left Arrow reorders the column with the previous one
      • Ctrl + Right Arrow reorders the column with the next one

      Actions applied on Grid data table

      • Arrow Keys to navigate over the cells
      • Enter on group row will toggle expand/collapse
      • Page Up pages on previouse page
      • Page Down pages on next page
      • Space selects the row holding the currently highlighted cell
      • Ctrl + Space selects or deselects the current row, while persisting previously selected rows (only for selection mode "multiple")
      • Shift + Space performs range selection, selects all the rows between the last selected one (with SPACE or mouse click) and the one holding the focused cell
      • Shift + Arrow Keys adds the row which holds the focused cell to the selection (only for selection mode "multiple")
      • Ctrl + Home focuses the first focusable element inside the body
      • Ctrl + End focuses the last focusable cell in the last row
      • Home focuses the first focusable cell in the row
      • End focuses the last focusable cell in the row
      • Ctrl + Space group/ungroup the focused column

      Description

      This demo illustrates the keyboard support of Telerik Grid for MVC, which provides quick access to available grid’s features without the need of using a mouse. This is very practical for apps that should cover the accessibility standards for people with disabilities.

      You can focus the grid using the ALT + W key combination, which will allow you to directly interact with the grid functionality through the provided keyboard shortcuts visualized above.

      Further details about the Keyboard, Section 508 and WAI-ARIA support of Telerik UI for ASP.NET MVC extensions can be found in the Accessibility Overview section of the documentation.

      ASP.NET MVC source

      Also available for:

      • keyboard_navigation.cshtml
      • Keyboard_NavigationController.cs

      Support & learning resources

      Grid for other technologies