Expand the treeview items initially in kendoui

Question

I am using kendo ui treeview widget control. I am dynamically getting the parents and child. How can i expand all the parents and child. I have wrote code:

          var treeview = $('#tree').kendoTreeView({
            dataSource: parent,
            dataTextField: ["question", "answer", "parentvalue"]
           });

            treeview.expand('.k-item');

but it is not working. How can i do that.

Answer 1

If you are using remote dataSource you will have no luck expanding it in such way because the items are still not loaded and created.

Instead use the dataBound event of the TreeView and set the loadOnDemand property to false (so all the items are loaded initially then try to expand the items (you might need to do it recursevely) .

Answer 2

The .kendoTreeView() function actually returns the jQuery elements that the treeview was applied to, not the widget itself.

Instead, you need to do:

$("#my-treeview").data("kendoTreeView").expand(".k-item");

Answer 3

As is your code, you only get the element created but not the data associated with it. You rather have to use such code:

$('#tree').kendoTreeView({
    dataSource: parent,
    dataTextField: ["question", "answer", "parentvalue"]
});
var treeview = $("#your-treeview-id").data("kendoTreeView");

as indicated in my comments above (and not var treeview = $("#tree").kendoTreeView(...)).

Answer 4

function ExpandTree() {

   treeview = $("#MyTreeview").data("kendoTreeView");

    if(treeview != undefined)
        {
            treeview.expand(".k-item");
        }
}

function CollapseTree()
{


   treeview = $("#MyTreeview").data("kendoTreeView");

    if(treeview != undefined)
        {
            treeview.collapse(".k-item");
             treeview.expand(".k-first"); //To expand only parent
        }
}