Popup and Inline Editing
The TreeList enables you to set its popup and inline edit modes.
The difference between the inline and popup edit modes is the position of the rendered editors. In the popup edit mode, the editors are rendered in a modal window. In the inline edit mode, the editors are rendered in the tr
element of the edited record. For a runnable example, refer to the demo on popup editing of the TreeList.
To enable the popup or inline edit mode:
- Configure the
toolbar
setting to display the Add new record button. -
Define a command column for the Update, Delete, and Add child buttons.
$("#treelist").kendoTreeList({ toolbar: [ "create" ], editable: "popup", //or "inline" columns: [ { field: "FirstName", expandable: true, title: "First Name", width: 250 }, { field: "LastName", title: "Last Name" }, { field: "Position" }, { field: "Phone", title: "Phone" }, { field: "Extension", title: "Ext", format: "{0:#}" }, { command: [{name: "createchild", text: "Add child"},"edit", "destroy" ], width: 300 } ], ... });