Vue Scheduler Component & Keyboard Navigation | Kendo UI for Vue Docs & Demos

Native Components

Wrapper Components

Barcodes
Buttons
Charts
Chat
DataSource
Date Inputs
Diagram
Dialog
Dropdowns
DropDownTree
Editor
Gantt
Gauges
Grid (wrapper)
Inputs
Layout
List Views
ListBox
Map
MediaPlayer
PivotGrid
Popups
Scheduler

Resources

Moving and Resizing

Keyboard Navigation

Adaptive Rendering

ScrollView
Spreadsheet
TreeList
TreeMap
TreeView
Upload
Validator
Window
Framework & Features
Globalization
Accessibility

Troubleshooting

Styling & Themes

Common Features

Changelog

Components / Wrapper Components / Scheduler / Keyboard Navigation /

The keyboard navigation of the Scheduler is always available.

The toolbar of the Scheduler supports the following keyboard shortcuts:

SHORTCUT	DESCRIPTION
`F10`	Focuses the toolbar.
`Tab`	Focuses the next toolbar item.
`Shift`+`Tab`	Focuses the previous toolbar item.
`Enter` or `Space`	Activates the toolbar item.
`Right Arrow`	Focuses the next view when the focus is on the view container.
`Left Arrow`	Focuses the previous view when the focus is on the view container.

The table of the Scheduler supports the following keyboard shortcuts:

SHORTCUT	DESCRIPTION
`Arrow Keys`	Changes the selected cell.
`Enter`	Creates a new event on the selected cells. Opens the Edit window for the selected event.
`Tab`	Focuses the next available event.
`Shift`+`Tab`	Focuses the previous available event.
`1` to `5`	Switches between the available views.
`Esc`	Closes the Edit popup window.
`Shift`+`Arrow Keys`	Selects multiple cells.

The following example demonstrates how to implement the Enter and Space keyboard shortcuts.

Example

View Source

Edit In Stackblitz

Change Theme:

Suggested Links