Thread ID: |
Created: |
Updated: |
Platform: |
Replies: |
146608 | Aug 10,2019 01:48 AM UTC | Aug 21,2019 06:12 AM UTC | jQuery | 3 |
![]() |
Tags: ejTreeGrid |
<script>
$("#TreeGridContainer").ejTreeGrid({
//...
columns: [
//...
{
field: 'custom', headerText: "Command Column",
commands: [
//...
{ type: "Add", buttonOptions: { text: "Add", click: addRow } },
]
}
],
queryCellInfo: function(args){
if (args.column.field == "custom") {
if(!args.data.hasChildRecords){
$(args.cellElement).find(".e-Addbutton").css({ 'display': 'none'});
}
}
}
})
function addRow(args){
var obj = $("#TreeGridContainer").ejTreeGrid("instance");
var index = obj.getIndexByRow(args.target.closest("tr"));
obj.selectRows(obj.getUpdatedRecords().indexOf(obj.model.currentViewData[index]));
var data = {};
obj.addRow(data, ej.TreeGrid.RowPosition.Child);
}
});
</script> |
Hi Xia,We can include custom buttons in command column to perform custom actions using the type property. By using queryCellInfo event of TreeGrid control, we can include the custom buttons only for the parent records. By using the addRow method, we can dynamically add the empty rows on custom button click action, using the click event of button control.Please find the below code example.
<script>$("#TreeGridContainer").ejTreeGrid({//...columns: [//...{field: 'custom', headerText: "Command Column",commands: [//...{ type: "Add", buttonOptions: { text: "Add", click: addRow } },]}],queryCellInfo: function(args){if (args.column.field == "custom") {if(!args.data.hasChildRecords){$(args.cellElement).find(".e-Addbutton").css({ 'display': 'none'});}}}})function addRow(args){var obj = $("#TreeGridContainer").ejTreeGrid("instance");var index = obj.getIndexByRow(args.target.closest("tr"));obj.selectRows(obj.getUpdatedRecords().indexOf(obj.model.currentViewData[index]));var data = {};obj.addRow(data, ej.TreeGrid.RowPosition.Child);}});</script>Please find the below sample link.Regards,Pooja Priya K.
This post will be permanently deleted. Are you sure you want to continue?
Sorry, An error occured while processing your request. Please try again later.
This page will automatically be redirected to the sign-in page in 10 seconds.