This is a migrated thread and some comments may be shown as answers.

TreeList expanded true for items loaded with ajax

3 Answers 73 Views
TreeList
This is a migrated thread and some comments may be shown as answers.
maxharn
Top achievements
Rank 1
maxharn asked on 28 Sep 2015, 01:28 PM

I am trying to expand items in treeList automatically.

In the following example you can see the result:

http://dojo.telerik.com/ukOMo/2

When the items a loaded with ajax extended = true does not really work.

Any way to achieve this?

My problem is also that I should open multiple levels of a branch.

 

3 Answers, 1 is accepted

Sort by
0
Patrick | Technical Support Engineer, Senior
Telerik team
answered on 28 Sep 2015, 04:28 PM
Hi Ivo,

Take a look at this demo illustrating how to expand a Kendo TreeList.  

You needed to configure your endpoint so the API would return All items with:
read: {
   url: crudServiceBaseUrl + "/EmployeeDirectory/All",
   dataType: "jsonp"
}

Also, your approach to expanding the TreeList Items works fine, but I provided an alternative for you:

schema: {
  model: {
    id: "EmployeeId",
    parentId: "ReportsTo",
    fields: {
      EmployeeId: { type: "number", nullable: false },
      ReportsTo: { field: "ReportsTo", nullable: true }
    },
    //Alternative to expand the complete TreeList:
    expanded: true
  }
}

Hope this helps!

Regards,
Pat
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
maxharn
Top achievements
Rank 1
answered on 29 Sep 2015, 07:33 AM

Expanding all was just an example. We have a lot of data and I cannot load the data for the whole tree in the beginning. This is why each branch should open with ajax request. My idea is that when user opens a branch, next time he refreshes the page the branches and subbranches he previously opened to be expanded. This is why I would keep all opened items ids in the localStorage

var expanded = localStorage["expandedIds"].split(","); //or something like this

And then comes
requestEnd : function (e) {
    $.each(e.response, function(){
            if($.inArray(this, expanded) > -1)this.expanded = true;
     });
}‚Äč

 But this seems not to be working out of the box. It seems that my JSONP should already contain the expanded branches. There is no other way right?

0
Alex Gyoshev
Telerik team
answered on 01 Oct 2015, 08:13 AM

Hello Ivo,

This approach will work if the children of the expanded items are loaded from the server, as shown in this Dojo snippet.

Regards,
Alex Gyoshev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
TreeList
Asked by
maxharn
Top achievements
Rank 1
Answers by
Patrick | Technical Support Engineer, Senior
Telerik team
maxharn
Top achievements
Rank 1
Alex Gyoshev
Telerik team
Share this question
or