jsTree onSelect event

Question

I\'ve been trying to get the text of a node that is selected in a jsTree. I am able to populate the tree and trigger the onSelect event, but I can\'t find out which node was cli

Answer 1

With the current version it's best to use get_selected with full: true, which means that the method will return the full object(s), and not only id.

So for example:

$("#treeNode").jstree('get_selected', true);

or:

$("#treeNode").jstree().get_selected(true);

Each element in the array will have all the properties as text or id.

Answer 2

jstree new version for get text from node should use data.node.text

$("#treeContainer").on("select_node.jstree",
     function(evt, data){
          alert(data.node.text);
     }
);

Answer 3

The click event doesn't pass any data with it, so the event object will need to be used.

.bind("click.jstree", function (event) {
    alert($(event.currentTarget).parent("li:first").text().trim());
});

Answer 4

$("#equipment_tree").bind("select_node.jstree", function(evt, data){

             var i, j, r = [], ids=[];
                for(i = 0, j = data.selected.length; i < j; i++) {
                  r.push(data.instance.get_node(data.selected[i]).text);
                }
                alert('Selected: ' + r.join(', '));
           }
);

you have to try this.

Answer 5

Update in 2018.

Thanks to @ProfK's comment, the API has changed in new version of jstree. In jstree v3.1.0 (or earlier), the API has changed to:

$("#treeContainer").on(
        "select_node.jstree", function(evt, data){
            //selected node object: data.node;
        }
);

---

For jstree old version (before 2013).

You can get the selected node object and its text by:

$("#treeContainer").bind(
        "select_node.jstree", function(evt, data){
            //selected node object: data.inst.get_json()[0];
            //selected node text: data.inst.get_json()[0].data
        }
);