treeview checked by code

[Lihong]

Hello,

I'm using Kendo.UI [2016.1.217.commercial].

And, I encountered a problem about TreeView. I want set some data items checked by code, these data items did not have expanded. What should I do?

I used " dataItem.set('checked', true) ", but it won't work.

[Lihong]

Any update?

[Lihong]

Any update/suggestion for this question?

For example, there are two data items, they have same parent node, and they haven't expanded, I want to checked them by code.

dataItem1.set('checked', true);

dataItem2.set('checked', true);

But, only dataItem2 is checked on screen. And if I expand dataItem2 by click, all checked is gone.

Could you help me?

[Daniel]

Hi,

As long as the children are already loaded, the checked state should be preserved even if the parent is not expanded. Could you check this example and let me know if I am missing something?

Regards,
Daniel
Telerik

 

 

[Lihong]

Hi,

I had made a demo here "http://dojo.telerik.com/UVOBa/5".

I'm using "template" of "checkboxes".

After I expanded root "Andrew Fuller" by code, and I checked "S14" by code, without expand it. Then I expanded "S14" by click, its checked state was gone, and checked state of its children were also gone. Why?

var members = [{
          EmployeeId: 1,
          FullName: "Andrew Fuller",
          HasEmployees: true,
          Employees: [{
          EmployeeId: 11,
          FullName: "Nancy Davollo",
          HasEmployees: false
        }, {
          EmployeeId: 12,
          FullName: "Janet Leverling",
          HasEmployees: false
        }, {
          EmployeeId: 13,
          FullName: "Margaret Peacock",
          HasEmployees: false
        }, {
          EmployeeId: 14,
          FullName: "S14",
          HasEmployees: true,
            Employees: [{
              EmployeeId: 141,
          FullName: "M141",
          HasEmployees: false
            }, {
              EmployeeId: 142,
          FullName: "R142",
          HasEmployees: false
            }, {
              EmployeeId: 142,
          FullName: "A142",
          HasEmployees: false
            }]
        }, {
          EmployeeId: 15,
          FullName: "Steven Buchanan",
          HasEmployees: true,
            Employees: [{
              EmployeeId: 151,
          FullName: "Michael Suyama",
          HasEmployees: false
            }, {
              EmployeeId: 152,
          FullName: "Robert King",
          HasEmployees: false
            }, {
              EmployeeId: 152,
          FullName: "Anne Dodsworth",
          HasEmployees: false
            }]
        }, {
          EmployeeId: 16,
          FullName: "Laura Callahan",
          HasEmployees: false
          }]
        }];
        
        
        var homogeneous = new kendo.data.HierarchicalDataSource({
          data: members,
          schema: {
            model: {
              id: "EmployeeId",
              hasChildren: "HasEmployees",
              children: "Employees"
            }
          }
        });

        var treeview = $("#treeview").kendoTreeView({
          animation: false,
          dataSource: homogeneous,
          dataTextField: "FullName",
          checkboxes: {
            checkChildren: true,
            template: function () {
              return "<input type='checkbox'/>";
            }
          }
        }).getKendoTreeView();
        
        var dataSource = treeview.dataSource;
        var node = dataSource.get("1");
        treeview.expand(treeview.findByUid(node.uid));
        node = dataSource.get("14");
        node.set("checked", true);
        node = dataSource.get("15");
        node.set("checked", true);

[Lihong]

Sorry, the demo link is "http://dojo.telerik.com/UVOBa/4"

[Lihong]

Thank you.

I had resolved by myself. I set "loadOnDemand" to "false" for option. Because my "HierarchicalDataSource" is array.

[Daniel]

Hello again,

The checkbox template should be based on the items checked field in order for the checked state to be shown correctly(updated example).

Regards,
Daniel
Telerik