How do I get the id of the selected node in jsTree?

问题

How can I get the id of the selected node in a jsTree?

function createNewNode() {
  alert('test');
  var tree = $.tree.reference("#basic_html");
  selectedNodeId = xxxxxxxxx; //insert instruction to get id here
  tree.create({ data : "New Node Name" }, selectedNodeId);
}

回答1:

Nodes in jsTree are essentially wrapped list items. This will get you a reference to the first one.

var n = $.tree.focused().get_node('li:eq(0)')

You can replace $.tree.focused() if you have a reference to the tree.

To get the id, take the first matched element

if (n.length)
    id = n[0].id

or you can use the jQuery attr function, which works on the first element in the set

id = n.attr('id');

回答2:

Unable to get harpo's solution to work, and unwilling to use Olivier's solution as it uses internal jsTree functions, I came up with a different approach.

$('#tree').jstree('get_selected').attr('id')

It's that simple. The get_selected function returns an array of selected list items. If you do .attr on that array, jQuery will look at the first item in the list. If you need IDs of multiple selections, then treat it as an array instead.

回答3:

In jstree version 3.1.1, you can get it directly from get_selected:

$("#<your tree container's id>").jstree("get_selected")

回答4:

In the most recent version of jsTree (checked at 3.3.3), you can do this to get an array of IDs:

var ids = $('#tree').jstree('get_selected');

This will return, for example, ["selected_id1", "selected_id2", "selected_id3"]. If you want to get the selected nodes (not IDs), you can do this:

var nodes = $('#tree').jstree('get_selected', true);

The current docs contain more information.

回答5:

  $.jstree._reference('#my_tree_container')._get_node(null, true).each(function() {
    id = $(this).attr("id");
    alert('Id selected: ' + id);        
  });

回答6:

I was having problems getting the selected ids from a tree with MULTIPLE selections. This is the way I got them:

var checked_ids = [];
$("#your-tree-id").jstree('get_selected').each(function(){    
      checked_ids.push($(this).data('id'));                         
});

回答7:

In my case, the data call doesnt work. I succeed in accessing my node data by using attr function.

$("#tree").jstree("get_selected").attr("my-data-name");

回答8:

to get all selected ids use the below code

var selectedData = [];
var selectedIndexes;
 selectedIndexes = $("#jstree").jstree("get_selected", true);
jQuery.each(selectedIndexes, function (index, value) {
     selectedData.push(selectedIndexes[index].id);
 });

now you have all the selected id's in the "selectedData" variable

回答9:

With latest version of Jstree; you can do it as following:

<script type="text/javascript>
    var checked_ids = [];
    $('#your-tree-id).jstree("get_checked",null,true).each(function(){
        checked_ids.push(this.id);
    });
    alert(checked_ids.join(","));
</script>

回答10:

<script type="text/javascript>
    checked_ids.push($(this).context.id);
</script>

回答11:

Just use

var nodeId = $('#FaqTreeView').jstree().get_selected("id")[0].id;

where #FaqTreeView is the id of your div that contains the jstree.

回答12:

In some cases and/or jstree versions this solution doesn't work.

$('#tree').jstree('get_selected').attr('id');

Instead of defined "id" I get nothing. What did the trick for me is:

$("#tree").jstree("get_selected").toString();

回答13:

These are all old answers for old versions. As of version 3.3.3 this will work to get all attributes of the selected node.

$('#jstree').jstree().get_selected(true)[0]

If you then want the id then add .id at the end. You can look at all the other attributes in web developer tools if you copy the above code.

回答14:

You can use the following code var nodes = $("#jstree_demo_div").jstree(true).get_selected("full", true);//List of selected node

nodes[0].id//Which will give id of 1st object from array

来源：https://stackoverflow.com/questions/2585502/how-do-i-get-the-id-of-the-selected-node-in-jstree