New to Telerik UI for Blazor? Download Free 30-day trial

ListView - Keyboard Navigation

Chai
Chang
Aniseed Syrup
Chef Anton's Cajun Seasoning
Chef Anton's Gumbo Mix
Grandma's Boysenberry Spread
Uncle Bob's Organic Dried Pears
Northwoods Cranberry Sauce
Mishi Kobe Niku
Ikura
1 - 10 of 77 items
  • Keyboard-navigation.razor
  • ProductService.cs
  • ProductDto.cs
Loading the demo source code...please wait.

Style in ThemeBuilder

  • Custom SASS variables
  • Atomic customizations
  • Sharing projects
Start Theming

Focus

  • Alt + W focuses the first component in the example

Supported keys and user actions

  • Right arrow or Down arrow Moves the focus to the next item. If the focus is on the last item, the focus does not move.
  • Left arrow or Up arrow Moves the focus to the previous item. If the focus is on the first item, the focus does not move.
  • Home Moves the focus to the first rendered item.
  • End Moves the focus to the last rendered item.

Description

Keyboard navigation provides all web and app users with a fast keyboard-only navigation capability and is also part of the web accessibility features - it enables users with disabilities to fully control their app components access through the keyboard.

The navigation order in which interactive items receive keyboard focus has to be logical and intuitive.

The keyboard navigation of the Telerik UI for Blazor ListView is always enabled, as demonstrated in this demo.

This Blazor ListView Keyboard Navigation example is part of a unique collection of hundreds of Blazor demos, with which you can see all Telerik UI for Blazor components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for Blazor or ThemeBuilder.

Support & Learning Resources
An error has occurred. This application may no longer respond until reloaded.