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

TreeView find, select, and expand child node automatically

3 Answers 896 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Fred
Top achievements
Rank 1
Fred asked on 19 Jun 2013, 10:40 PM
I have a functioning TreeView using and Ajax datasource that displays six root nodes, some of which have children.  I want to automatically find a child node by its id and then select the child and expand it's parent node(s) in order to be visible.  The problem I have is that the TreeView only loads the root nodes.  Querying both the tree and datasource result in the child not being found, but I can find and select one of the six root nodes.  I have tried setting LoadOnDemand(false), but it doesn't load all the child nodes.

I have not been able to wrap my brain about how to generate a full hierarchical dataset in my MVC controller to return as JSON that would have all the child nodes based on the examples I have seen.  Am I missing a method/configuration setting to load all children in the tree automatically?    I've been Googling and looking at lots of stuff, but maybe I'm just being dense.  

Any pointers are appreciated!

Edit 23 June 2013

I finally found out the root of the problem.  I found it in this post:

http://www.kendoui.com/forums/mvc/treeview/treeview-ajax-without-load-on-demand.aspx

The LoadOnDemand(false) does not work when using the MVC Wrapper and a HierarchicalDataSource.  Once I converted to pure JavaScript initialization, everything started to work once I converted my data to a hierarchical structure.  For those of you looking for a good library to convert flat tables into a hierarchical structure, take a look at this set of classes.  They worked great for me.  The only drawback is that it does not work with null parentIds.

http://blog.reneorban.com/2012/04/ashierarchy-generic-extension-method-to_12.html

I also made use of this Linq example to convert the model:

http://stackoverflow.com/questions/947831/c-sharp-algorithm-for-generating-hierarchy

Finally to find, select, and expand the necessary nodes in the tree, I leveraged this example:

http://www.kendoui.com/forums/ui/treeview/example-treeview-with-highlight-search-term.aspx

Hopefully others will find these references useful. 

3 Answers, 1 is accepted

Sort by
0
Accepted
Petur Subev
Telerik team
answered on 21 Jun 2013, 03:39 PM
Hello Fred,

Basically if loadOnDemand is set to false each level should be loaded - however it shoud take longer time. How do you 'wait' for the requests to finish, do you use the dataBound event? It should be triggered for each request performed.

Can you give us an example in which demonstrates fault of loadOnDemand?

Here is a simulated example:

http://jsbin.com/uwuquz/2/edit


Kind Regards,
Petur Subev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Fred
Top achievements
Rank 1
answered on 22 Jun 2013, 06:16 PM
Petur,
Thank you very much for the example. After much research as well as trial and error, I finally found the magic answer here:

http://www.kendoui.com/forums/mvc/treeview/treeview-ajax-without-load-on-demand.aspx

The key was that I was using the MVC wrapper with LoadOnDemand(false) and a HierarchicalDataSource. This combination won't work. I converted to Javascript initialization with loadOnDemand(false) and now everything is working.

For those of you who need a good example of how to build a hierarchical model from a flat table, you should check out this code. It works great for me.

http://blog.reneorban.com/2012/04/ashierarchy-generic-extension-method-to_12.html

If you need to convert the hierarchy using linq, here is a good example that I leveraged,

http://stackoverflow.com/questions/947831/c-sharp-algorithm-for-generating-hierarchy
0
Fred
Top achievements
Rank 1
answered on 23 Jun 2013, 08:51 PM
Hi Petur,

I finally found out the root of the problem.  I found it in this post:

http://www.kendoui.com/forums/mvc/treeview/treeview-ajax-without-load-on-demand.aspx

The LoadOnDemand(false) does not work when using the MVC Wrapper and a HierarchicalDataSource.  Once I converted to pure JavaScript initialization, everything started to work once I converted my data to a hierarchical structure.  For those of you looking for a good library to convert flat tables into a hierarchical structure, take a look at this set of classes.  They worked great for me.  The only drawback is that it does not work with null parentIds.

http://blog.reneorban.com/2012/04/ashierarchy-generic-extension-method-to_12.html

I also made use of this Linq example to convert the model:

http://stackoverflow.com/questions/947831/c-sharp-algorithm-for-generating-hierarchy

Finally to find, select, and expand the necessary nodes in the tree, I leveraged this example:

http://www.kendoui.com/forums/ui/treeview/example-treeview-with-highlight-search-term.aspx

Hopefully others will find these references useful. 
Tags
TreeView
Asked by
Fred
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Fred
Top achievements
Rank 1
Share this question
or