• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGrid
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

Keyboard Navigation

By default, the keyboard navigation of the Kendo UI ListView for Angular is disabled. To enable the keyboard navigation, set the navigable property to true.

The ListView supports the following keyboard shortcuts:

Right Arrow & Down ArrowMoves the focus to the next item. If the focus is on the last item, the focus does not move.
Left Arrow & Up ArrowMoves the focus to the previous item. If the focus is on the first item, the focus does not move.
HomeMoves the focus to the first rendered item.
EndMoves the focus to the last rendered item.
View Source
Change Theme:

Controlling the Focus

To control the focus of the ListView items, use any of the following methods and props:

  • focus(index?: number)—Focuses the item at the targeted index. If no param is provided, the item that last received focus will be focused.
  • activeIndex—Gets the index of the item that last received focus. You can use this value as a starting point when you perform external navigation.

When the ListView is not navigable, the activeIndex property returns null and the focus method will no not have any effect.

The following example demonstrates how external focus management can be performed.

View Source
Change Theme:

In this article

Not finding the help you need?