Example of Keyboard Interaction in ASP.NET MVC Tree Grid Control

This demo showcases the keyboard shortcuts applicable on Tree Grid and also lists out in below description, how those applicable shortcuts interacts with Tree Grid actions.

DEMO

SOURCE

Keys	Description
F2	Cell edit
Enter	Save request
Delete	Delete row
Ctrl + Shift + UpArrow	Collapse Child Grid
Ctrl + Shift + DownArrow	Expand Child Grid
Ctrl + UpArrow	Collapse All
Ctrl + DownArrow	Expand All
Ctrl + Home	First row selection
Ctrl + End	Last row selection
Home	First cell selection
End	Last cell selection
Up Arrow	Move row selection up
Down Arrow	Move row selection down
Right Arrow	Move Cell selection right
Left Arrow	Move Cell selection left
Shift + Down/Up	Multiple row Selection
Ctrl + j	Focus Tree Grid element

All the Tree Grid actions can be controlled via keyboard keys. The applicable key combinations and its relative functionalities are listed below.

Keys	Description
`Ctrl + Down Arrow`	ExpandAll
`Ctrl + Up Arrow`	CollapseAll
`F2`	Edit
`ESC`	Cancel
`Enter`	Save
`Insert`	Add
`Delete`	Delete
`Ctrl + Home`	First row selection
`Ctrl + End`	Last row selection
`Home`	First cell selection
`End`	Last cell selection
`Up Arrow`	Move row selection up
`Down Arrow`	Move row selection down
`Up Arrow`	Move Cell selection up
`Down Arrow`	Move Cell selection down
`Right Arrow`	Move Cell selection right
`Left Arrow`	Move Cell selection left
`Shift + Down/Up`	Multiple row Selection
`Shift + Right/Left/Down/Up`	Multiple Cell Selection
`Ctrl + Shift + Up Arrow`	Collapse selected parent row
`Ctrl + Shift + Down Arrow`	Expand selected parent row
`Ctrl + j`	Focus Tree Grid element
`Tab`	Go to next cell for editing
`Shift + Tab`	Go to previous cell for editing
`PageDown`	Go to Next page
`PageUp`	Go to Previous page
`Ctrl + Alt + PageUp`	Go to First page
`Ctrl + Alt + PageDown`	Go to Last page
`Alt + PageUp`	Go to Next pager
`Alt + PageDown`	Go to last pager

More information on the Tree Grid keyboard interaction can be found in the documentation section.