kendo treeview getting infinite loop in child node

Question

so im having a problem with my kendo treeview. im getting the right parent but on the child node it has another level same as the child node that goes infinity. i tried to set the 'hasChildren = false ' in my child node but its not working. hope you could help me with this one.

here's my code:

html:

<div id="treeview1"></div>

script:

  var Customer = new kendo.data.HierarchicalDataSource({
        transport: {
            read: {
                url: '/Position/LoadGetCompanyList',
                dataType: "json"
            }
        },
        schema: {
            model: {
                id: "ID",
                hasChildren: true,
            children: Positions
            }
        }



    });

    var Positions = {
        transport: {
            read: {
                url:'/Position/LoadIndustriesPositionList',
                dataType: "json"
            }
        },
        schema: {
        model: {
            id: "ID",
            hasChildren: false

        }
    }

};
$("#treeview1").kendoTreeView({
    dataTextField: ["CompanyName", "JobName"],
    // dataValueField: "Client_CustomerID",
    //            select: function (e) {
    //                console.log("Selecting ", e.node)
    //            },
    dataSource: Customer
}).data("kendoTreeView");

ill attach the link of my references here: http://rameshrajappan.wordpress.com/kendo-treeview-with-asp-net-mvc/ http://demos.telerik.com/kendo-ui/treeview/remote-data-binding

thanks.

Answer 1

You need to define the variable in correct order (Child first then Parent). The Positions variable should come before Customer as the Customer uses the Positions as its child.

Its a weird behavior of Kendo Tree View that if the order is not correct, Kendo Tree view shows the child node in a infinite loop.

The corrected code should be as below

var Positions = {
    transport: {
        read: {
            url:'/Position/LoadIndustriesPositionList',
            dataType: "json"
        }
    },
    schema: {
    model: {
        id: "ID",
        hasChildren: false

    }
}

};

  var Customer = new kendo.data.HierarchicalDataSource({
    transport: {
        read: {
            url: '/Position/LoadGetCompanyList',
            dataType: "json"
        }
    },
    schema: {
        model: {
            id: "ID",
            hasChildren: true,
        children: Positions
        }
    }



});


$("#treeview1").kendoTreeView({
dataTextField: ["CompanyName", "JobName"],
// dataValueField: "Client_CustomerID",
//            select: function (e) {
//                console.log("Selecting ", e.node)
//            },
dataSource: Customer
 }).data("kendoTreeView");