This sample demonstrates the usage of context menu in Tree Grid component. Right click anywhere on the Tree Grid to view context menu.
Task ID | Task Name | Start Date | End Date | Duration | Priority |
|---|---|---|---|---|---|
| 1 | Planning | 2/3/2017 | 2/7/2017 | 5 | Normal |
| 2 | Plan timeline | 2/3/2017 | 2/7/2017 | 5 | Normal |
| 3 | Plan budget | 2/3/2017 | 2/7/2017 | 5 | Low |
| 4 | Allocate resources | 2/3/2017 | 2/7/2017 | 5 | Critical |
| 5 | Planning complete | 2/7/2017 | 2/7/2017 | 0 | Low |
| 6 | Design | 2/10/2017 | 2/14/2017 | 3 | High |
| 7 | Software Specification | 2/10/2017 | 2/12/2017 | 3 | Normal |
| 8 | Develop prototype | 2/10/2017 | 2/12/2017 | 3 | Critical |
| 9 | Get approval from customer | 2/13/2017 | 2/14/2017 | 2 | Low |
| 10 | Design Documentation | 2/13/2017 | 2/14/2017 | 2 | High |
Tree Grid has an option to show the context menu when right click on it. To configure the items in context menu, you should define either default or custom item in contextMenuItems . Each item will be shown based on its target. The default items are Edit - Edit the current record. Delete - Delete the current record. Save - Save the edited record. Cancel - Cancel the edited state. PdfExport - Export the grid as Pdf format. ExcelExport - Export the grid as Excel format. CsvExport - Export the grid as CSV format. SortAscending - Sort the current column in ascending order. SortDescending - Sort the current column in descending order. FirstPage - Go to the first page. PrevPage - Go to the previous page. LastPage - Go to the last page. NextPage - Go to the next page. Add Row Above - Add a new row above the selected row Below - Add a new row below the selected row Indent - Indents the record to one level of hierarchy. Outdent - Outdent the record to one level of hierarchy. In this demo, Context Menu feature has enabled by defining the contextMenuItems property with all default items. More information on the Default context-menu can be found in documentation section