Keyboard Navigation

The keyboard navigation of the MultiSelectTree is always available.

Keyboard Shortcuts

The MultiSelectTree supports the following keyboard shortcuts:

SHORTCUT	DESCRIPTION
Up Arrow	Moves the focus to the previous focusable item without opening or closing an item.
Down Arrow	Moves the focus to the next focusable item without opening or closing an item.
Left Arrow	Closes an open, focused item. Moves the focus from an end or closed child item to the parent item. Does nothing when the focus is on an end or closed root item.
Right Arrow	Opens a closed, focused item. Does not move the focus. Moves the focus from an open and focused item to its child item. Does nothing when the focus is on an end item.
Space	Checks the highlighted item if the popup is already open.
Esc	Closes the popup.
Home	Moves the focus to the first item in the tree without opening or closing an item.
End	Moves the focus to the last focusable item in the tree without opening or closing an item.
Alt+Down Arrow or Enter	Opens the popup.
Alt+Up Arrow	Closes the popup.
Space	Opens the popup.

Tags Navigation

The MultiSelectTree allows users to navigate through the value tags when the focus is on the input wrapper.

SHORTCUT	DESCRIPTION
Left arrow	Highlights previously selected tag.
Right arrow	Highlights next selected tag.
Home	Highlights the first selected tag. (when the popup is closed)
End	Highlights the last selected tag. (when the popup is closed)
Delete	Deletes highlighted item.
Backspace	Deletes the highlighted item or the last item if none is highlighted.

Up Arrow and Down Arrow allow moving the focus to and from the input wrapper.

Change Theme

Theme

Loading ...

Navigation Scenarios

When the popup of the MultiSelectTree is opened, it adopts the same keyboard shortcuts as the keyboard shortcuts of the TreeView component with enabled checkboxes.

Suggested Links

• API Reference of the MultiSelectTree
• Accessibility