Access TreeView Node DataItem Property

Environment

Product TreeView for ProgressĀ® Kendo UIĀ®
Product Version 2018.2.516

Description

How can I access the ID value of a TreeView node's DataItem?

Solution

In order to get a property from the model of a specific node, we take advantage of the dataItem method of the Kendo UI TreeView API.

The following sample demonstrates the approach described above by displaying an alert with the DataItem's ID on the selection of a node:

<div class="demo-section k-content">
  <div id="treeview"></div>
</div>
<script>
  var serviceRoot = "https://demos.telerik.com/kendo-ui/service";
  homogeneous = new kendo.data.HierarchicalDataSource({
    transport: {
      read: {
        url: serviceRoot + "/Employees",
        dataType: "jsonp"
      }
    },
    schema: {
      model: {
        id: "EmployeeId",
        hasChildren: "HasEmployees"
      }
    }
  });

  function onSelect(e) {
    var node = e.node;
    var treeview = $("#treeview").data("kendoTreeView");
    var dataItem = treeview.dataItem(node);
    alert("Employee ID of selected person: " + dataItem.EmployeeId);
  }

  $("#treeview").kendoTreeView({
    dataSource: homogeneous,
    dataTextField: "FullName",
    select: onSelect
  });
</script>

See Also

In this article
Not finding the help you need? Improve this article