Blazor Gantt Chart Example - Keyboard Navigation Support

Gantt Chart / Miscellaneous / Keyboard Navigation

GanttChart functionalities can be interactive with keyboard shortcuts. In the below sample various key combinations can be used to interact with the Gantt chart.

Loading Syncfusion Blazor Server Demos…

Below key combinations can be used in the Gantt chart to initiate various actions
  • FOCUS
    • Alt + J - Focuses on the first component of the sample.
    • Home - Moves the focus to the first cell of the focused row.
    • End - Moves the focus to the last cell of the focused row.
    • Ctrl + Home - Moves the focus to the first Cell of the first row in our GanttChart component.
    • Ctrl + End - Moves the focus to the last cell of the last row in our GanttChart component.
    • Down arrow - Moves the cell focus downward from the focused cell.
    • Up arrow - Moves the cell focus upward from the focused cell.
    • Left arrow - Moves the cell focus left side from the focused cell.
    • Right arrow - Moves the cell focus right side from the focused cell.
  • SELECTION
    • Shift + Down arrow - Extends the row/cell selection downwards from the selected row/cell.
    • Shift + Up arrow - Extends the row/cell selection upwards from the selected row/cell.
    • Shift + Left arrow - Extends the cell selection to the left side from the selected cell.
    • Shift + Right arrow - Extends the cell selection to the right side from the selected cell.
    • Up arrow - Moves the cell focus/row or cell selection upward.
    • Down arrow - Moves the cell focus/row or cell selection downward.
    • Right arrow - Moves the cell focus/row or cell selection right side.
    • Left arrow - Moves the cell focus/row or cell selection left side.
  • EDITING
    • Ctrl + Insert - Opens addRowDialog.
    • Ctrl + F2 - Opens editRowDialog.
    • Del - Deletes the currently selected record.
    • Insert - Adds a new row.
    • Enter - Saves the current form if the Mode is Normal or Dialog / Saves the current cell.
  • EXPANDCOLLAPSE
    • Ctrl + Down arrow - Expands all tasks.
    • Ctrl + Up arrow - Collapses all tasks.
    • Ctrl + Shift + Up arrow - Collapses the selected row.
    • Ctrl + Shift + Down arrow - Expands the selected row.

For more details, refer to the documentation section.

Transform your Blazor web apps today with Syncfusion® Blazor components
100+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE