New to KendoReactStart a free 30-day trial

Keyboard Navigation
Premium

Keyboard Shortcuts

The Gantt component is a container that consists of 4 logically separated structural elements:

  • Toolbar (role="toolbar");
  • Splitter (role="separator");
  • TreeList (role="treegrid");
  • TimeLine (role="tree")

Each of them is part of the page tab sequence and can be navigated to using the Tab key of the keyboard. The list above illustrates the focus sequence.

The Toolbar implements the keyboard navigation specification for a ToolBar component:

ToolBar specification

The Splitter implements the keyboard navigation specification for a Splitter component

Splitter specification

Gantt shortcuts

ShortcutBehavior
Alt/Opt(Mac) + 1,2,3,...navigates to the view with the respective number
F10Focuses the ToolBar.

TreeList shortcuts

The TreeList implements the keyboard navigation specification for a TreeList component:

TreeList specification

ShortcutBehavior
TabMoves focus to the corresponding task in the TimeLine.
Shift + TabIf focus has been previously on the same line in the treelist, moves focus to last focused cell. Otherwise, focus the last cell on the same line.

TimeLine Shortcuts

ShortcutBehavior
HomeMoves focus to first task.
EndMoves focus to the last task.
Up ArrowMoves focus to previous task.
Down ArrowMoves focus to the next task.
Left ArrowScrolls the view to the left.
Right ArrowScrolls the view to the right.
EnterGantt Popup Form is opened to provide editing of the task. The dependencies and field edit is made. On close focus is returned on the task.
DeleteThe task gets deleted. The focus is moved to the previous task.
Alt/Opt(Mac) + Right ArrowThe task is expanded, if it contains child tasks. The task should remain in focus and the timeline should be scrolled to it.
Alt/Opt(Mac) + Left ArrowThe task is collapsed, if it contains child tasks. The task should remain in focus and the timeline should be scrolled to it.
Change Theme
Theme
Loading ...

See Also