How to enable Editing in TreeGrid
We can enable editing in TreeGrid by set “AllowEditing” property as “True”.
The following edit modes are available in TreeGrid,
- Cell Editing
- Row Editing
- Dialog Editing
Cell Editing
In cell editing mode user can edit a specific cell of the selected row by set “EditMode” property as “CellEditing”. The below code example explains how to enable cell edit mode in TreeGrid.
[MVC] <body> <script type="text/javascript"> @(Html.EJ().TreeGrid("TreeGridContainer") //... .EditSettings(edit => { edit.AllowEditing(true); edit.EditMode(TreeGridEditMode.CellEditing); }) .Datasource((System.Collections.IEnumerable)ViewBag.datasource) ) @(Html.EJ().ScriptManager()) </script> </body>
The following screen shot illustrates the cell edit mode in TreeGrid.
Row Editing
It is possible to make the entire row to editable state and to update a record by set “EditMode” property as “RowEditing”, please refer the below code snippet.
[MVC] <body> <script type="text/javascript"> @(Html.EJ().TreeGrid("TreeGridContainer") //... .EditSettings(edit => { edit.AllowEditing(true); edit.EditMode(TreeGridEditMode.RowEditing); }) .Datasource((System.Collections.IEnumerable)ViewBag.datasource) ) @(Html.EJ().ScriptManager()) </script> </body>
The following screen shot illustrates the row edit mode in TreeGrid.
Sample link
A TreeGrid sample with inline editing is available in the following link, Sample.
Dialog Editing
We can perform add/edit actions through edit dialog, we can enable dialog edit mode by set “EditMode” as “DialogEditing”, please refer the below code snippet for this.
[ASP] <body> <script type="text/javascript"> @(Html.EJ().TreeGrid("TreeGridContainer") //... .EditSettings(edit => { edit.AllowEditing(true); edit.EditMode(TreeGridEditMode.DialogEditing); }) .Datasource((System.Collections.IEnumerable)ViewBag.datasource) ) @(Html.EJ().ScriptManager()) </script> </body>
The following screen shot illustrates the dialog edit mode in TreeGrid.
Sample link
A TreeGrid sample with dialog editing is available in the following link, Sample