New to Kendo UI for Vue? Start a free 30-day trial
Keyboard Navigation
The keyboard support of the DropDownTree is always available.
The DropDownTree supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Access Key+w | Focuses the DropDownTree. |
When the popup is closed, the DropDownTree supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Right Arrow | Highlights the next selected item. |
Left Arrow | Highlights the previously selected item. |
Home | Highlights the first selected item. |
End | Highlights the last selected item. |
Delete | Deletes the highlighted item. |
Backspace | Deletes the highlighted item or the last item. |
Alt+Down Arrow | Opens the popup. |
Esc | Clears all items. |
When the popup is opened, the DropDownTree supports the following keyboard shortcuts:
| SHORTCUT | DESCRIPTION |
|---|---|
Down Arrow | Highlights the next item. |
Up Arrow | Highlights the previous item. |
Home | Highlights the first item in the popup. |
End | Highlights the last item in the popup. |
Alt+Up Arrow | Closes the popup. |
Esc | Closes the popup. |
The DropDownTree supports the following keyboard shortcuts for navigation:
| SHORTCUT | DESCRIPTION |
|---|---|
Down Arrow | Highlights the next item. |
Up Arrow | Highlights the previous item. |
Left Arrow | Collapses the item. |
Right Arrow | Expands the item. |
Home | Highlights the first item in the list. |
End | Highlights the last item in the list. |
Enter | Selects the highlighted item when the DropDownTree does not render checkboxes. |
Space | Checks the highlighted item when the DropDownTree renders checkboxes. |
Example
View Source
Change Theme:
