Programatically select a tree node

[Andrew]

Hi,

I have searched the web and the forums but I just don't get how to do this.

I load a tree from a datasource and each tree element has an attribute with 'data-id="xx"'. Where xx is a unique id number. The tree is drawn fine. I can select the first row in the tree with  'treeview.select(".k-first");'

But I want to select the tree item with id = 9125. How on earth do you do that? It should be so easy but I just don't get it.

Thanks

[Iliana Dyankova]

Hello Andrew,

To achieve this I can suggest the following approach: 

• Get the dataItem via the get method of the dataSource;
• Use the findbyuid method of the TreeView, which searches a TreeView for a node with the given unique identifier;
• In the select method set the result from the previous step.

var treeview = $("#treeview").data("kendoTreeView");
var getitem = treeview.dataSource.get(9125);
treeview.findByUid(getitem.uid);
var selectitem = treeview.findByUid(getitem.uid);
treeview.select(selectitem);

Regards,

Iliana Nikolova
the Telerik team

[Kuangyi]

does .get() work correctly on hierarchical data source?

When I do treeview.dataSource.get() I only get stuff back when I pass in 1, and none of my other ID's will get values back.

[Andrew]

Hi and thank you for your response. Unfortunately it didn't work for me.

I build my tree by creating the list programatically using an iterative append process where the append (with array[i].id=9125) looks like:
  p1.append($('<ul>').append($('<li>')
  .attr({"data-id": array[i].id,"data-cltype": array[i].cltype})
  .addClass("L0" + array[i].level + "_" + array[i].id)
   .append(html).attr({"encoded": false})));

The approach was taken from a Kendo example. It works really well in creating the treeview except it does not appear to generate a datasource (I'm not sure why I thought it would actually) so "var getitem = treeview.dataSource.get(9125);" fails.

I guess I will have to change to a datasource approach if that works with hierarchial data per Kuangyi's comment.

Thanks

[Iliana Dyankova]

Hi guys,

Yes, the get() method of the dataSource works correctly with hierarchical dataSource when the items have id. You can test the suggested approach for example in this online demo (where a hierarchical dataSource is used).

Regards,
Iliana Nikolova
the Telerik team

[P]

I also am unable to use get() with an HierarchicalDataSource.
It works if the id value is a top-level node, but it returns undefined if the 'id' is for a child.
Am I missing something?

var t = $("#treeView").data("kendoTreeView");
var ok = t.dataSource.get(1);
var bad = t.dataSource.get(2);  //undefined
var ok2 = t.dataSource.get(5);


All of my items have an id.  I have the datasource defined as such:

 var myTree = new kendo.data.HierarchicalDataSource({
            data: db.bodyPartsTree,
            schema: {
                model: {
                    children: "items",
                    id: "id"
                    }
                }
            });


var bodyPartsTree =  [
    {text: "Brow", id: 1, items: [
            {text: "Epithelium", id: 2 },
            {text: "Eyebrow Hair", id: 3 },
            {text: "Subcutaneous Tissue", id: 4 }
           ] },
    {text: "Cornea", id: 5, items: [
                 {text: "Limbus", id: 6},
                 {text: "Margin", id: 7}
                 ]}
  ]

[Ivan]

I am having same problem:
I try to select node, which is child of root

treeview.dataSource.get(id_not_root_node);

ALWAYS returns undefined

http://jsfiddle.net/JBeQn/43/

We are migrating our old webapp to kendoui.
This moment (programmatically select child node) is really important for us.

Could you please fix this? Are there any workarounds?

[Anker Berg-Sonne]

I have exactly the same problem.and desperately need something that works.

dataSource.get() ONLY returns the proper result when the node is in the top level of the hierarchy. Anything lower in the hierarchy returns undefined.

This is on Q2. I had to drop back to Q2 from Q3 because of too many bugs.

Anker

[Anker Berg-Sonne]

From examining the dataSource attribute it looks like I can implement my own code by walking the _data structure using the hasChildren and children attributes of each element in the array. I don't like to do it, but if there's no other way I guess I'll have to do it. By walking the data structure I can find the UID if the node and then do a select(findByUid()) of the located UID. Ugly, but it should work.

It is very much preferable to have the get() function work correctly with a hierarchical data source.

Anker

[Alex Gyoshev]

Hello Anker,

The latest internal builds have this implemented. If you encounter a bug in the release, it's wiser to report it and have it fixed rather than keeping the previous version and implementing the functionality in parallel with the library.

Regards,
Alex Gyoshev
the Telerik team

[Dan]

Kikolova,
I think "var selectitem = treeview.findByUid(getitem.uid);" should be:
var selectitem = treeview.findByUid(getitem.uid)[0];

the "findByUid" returns an array and not just one node to select.
Then you have to do something like this if you want to handle the same event as if you clicked on the tree node:
         var e = { node: selectItem };
         onSelect(e); //call your handler