Reputation: 219
I have a requirement where I have a kendo treeview with checkboxes and have to disable the child nodes when the parent check box is checked.
My treeview is bound to a heirarchical data model from through MVC model binding.
@(Html.Kendo().TreeView()
.Name("TreeViewModel")
.Checkboxes(true)
.CheckboxTemplateId("treeview-template")
.ExpandAll(true)
.HighlightPath(true)
.BindTo(Model.TreeViewData)
.DragAndDrop(false)
.LoadOnDemand(false)
And my checkbox template looks like
<input type="checkbox" onclick="Addnode('#: item.text #', '#: item.id #', this.checked)" id ="#: item.id #" />
I am trying to get the list of child nodes for the checked node, but havent progressed much. In the AddNode function I use
var dataSource = treeview.dataSource;
var dataItem = dataSource.get(id);
var node = treeview.findByUid(dataItem.uid);
to get the selected node, but node.hasChildren returns undefined and I dont seem to find a solution to get a list of child nodes for this one.
I have tried the JS fiddle here Js Fiddle
Can someone help me out here please.
Upvotes: 1
Views: 5073
Reputation: 40887
Define the following JavaScript code:
$("#treeview").on("change", ":checkbox", function(e) {
// Get reference to the Tree View
var treeview = $("#treeview").data("kendoTreeView");
// Get the node owning the checked checkbox
var current = $(e.target).closest("li.k-item");
// Enable or Disable any child items depending if current item is checked or not
treeview.enable($(".k-item", current), !e.target.checked);
});
Your code modified here : http://dojo.telerik.com/@OnaBai/akoYU
Upvotes: 1