Hi Bogumil,
In TreeGrid, we have a public method called “cellEdit” to make any cell to editable state by passing its row index and header text as argument.
For this method we need to select the row before call the “cellEdit” method, we can select the row in TreeGrid by using “selectedRowIndex” property.
We also have a public method called “saveCell” to save any edited cell. And also, we can edit any cell/row by using context menu support.
Please refer following code snippet,
|
[JS]
<body>
<button onclick="rename()">Rename</button>
<div id="TreeGridContainer" style="width: 100%; height: 450px;"></div>
$("#TreeGridContainer").ejTreeGrid({
dataSource: sampleData,
//..
contextMenuSettings: {
showContextMenu: true,
contextMenuItems: ["add", "edit", "delete"]
},
})
<script>
function rename() {
$("#TreeGridContainer").ejTreeGrid('model.selectedRowIndex', 2); // Select the row to edit.
var treeObj = $("#TreeGridContainer").ejTreeGrid('instance');
treeObj.cellEdit(2, 'taskName'); // Public method to make any cell to editable state - cellEdit(rowIndex,headerText).
//$('#TreeGridContainertaskName').val('change');
//treeObj.saveCell(); // Public method to save any edited cell.
}
</script>
</body> |
We have also prepared a sample for your reference, please find the sample location as below,
Thanks,
Suriyaprasanth R.
