@(Html.EJ().TreeGrid("TreeGridContainer")
.ClientSideEvents(eve =>
{
eve.ActionComplete("actionComplete");
eve.Create("create");
eve.Expanded("expanded");
eve.Collapsed("collapsed");
eve.RowSelected("rowSelected");
})
)
@(Html.EJ().ScriptManager())
<script>
function create(args) {
//To update the height of TreeGrid during load time
updateTreeHeight();
}
function collapsed(args) {
//To update the height of TreeGrid during collapse action
updateTreeHeight();
}
function expanded(args) {
//To update the height of TreeGrid during expand action
updateTreeHeight();
}
function rowSelected(args) {
//To update the height of TreeGrid while adding any row
updateTreeHeight();
}
function actionComplete(args) {
//To update the height of TreeGrid while saving the newly added row and deleting the existing row
if (args.requestType == "addNewRow" || args.requestType == "delete") {
updateTreeHeight();
}
}
function updateTreeHeight() {
var tree = $("#TreeGridContainer").ejTreeGrid("instance"),
toolbar = $("#TreeGridContainer_toolbarItems").height(),
model = tree.model,
totalLen = tree.getExpandedRecords(model.updatedRecords);
//To calculate the height of TreeGrid as per records count
var height = model.rowHeight * totalLen.length + tree.getHeaderContent().height() + toolbar+4;
//Update height using setModel
var sizesettings = { height: height.toString() };
tree.setModel({ "sizeSettings": sizesettings });
}
</script> |
@(Html.EJ().TreeGrid("TreeGridContainer")
.EnableCollapseAll(true)
) |