Hi,
I am trying to work out how I can disable nodes in a TreeView based on whether the node is checked. For some reason I'm not able to retrieve the TreeView as such I am unable to iterate through the nodes and get the ones that are checked.
Here is my code:
Controller
public class HomeController : Controller
{
CalendarEventsEntities2 db = new CalendarEventsEntities2();
private SchedulerMeetingService meetingService;
public ActionResult SideNavMenu()
{
return View();
}
}
View
<div class="demo-section k-content">
@(Html.Kendo().TreeView()
.Name("treeview")
.DataTextField("Name")
.DataUrlField("LinkURL")
.Checkboxes(true)
.HighlightPath(true)
.DataSource(dataSource => dataSource
.Read(read => read
.Action("Menu", "Home")
)
)
)
</div>
<script>
$(document).ready(function() {
var treeView = $("#treeview").data("kendoTreeView");
var nodes = treeView.dataSource.view();
for (var i = 0; i < nodes.length; i++) {
alert('uuu');
var node = nodes[i];
//sets the parent node check property to true
node.set("checked",true);
if (node.checked) {
if (node.hasChildren){
var children = node.loaded() && node.children.data();
for (var i = 0; i < children.length; i++) {
node.children.at(i).set("enabled", false);
}
} else {
if (node.hasChildren) {
for (var i = 0; i < node.children.length; i++) {
node.children.at(i).set("enabled", true);
}
}
}
}
};
});
</script>
1 Answer, 1 is accepted
There is an existing demo for the Kendo UI TreeView, where similar behavior to the one described is demonstrated:
The above implementation relies on the TreeView's check event, on which the state of the TreeView nodes is being preserved in a collection and then the output is being shown in a result div element below the widget.
Regards,
Dimitar
Progress Telerik