In jsTree , How to get Node information by node id?

Question

In jsTree ,How to get Node information by node id ?

I know id of following node i.e 295 then how to get complete node information

<item id="295" parent_id="192" title="itemTitle"   version="1">    
            <content><name>Bhushan Sambhus</name></content>  
</item> 

above xml part rendered into jsTree is as follows

    $("#treeViewDiv").jstree({ 
        "xml_data" : {
            "data" : "" + 
"<root>" + 
    "<item id="295" parent_id="192" title="itemTitle"   version="1">"+    
            "<content><name>Bhushan Sambhus</name></content>  "+
     "</item>"
        }
        "plugins" : [ "themes", "xml_data","ui" ]
    });

Something like following psudo code

 function getNodeByNodeID(node_id){
          // some code
          // $.jstree.get_node ...... etc ?
          // 
           return relatedNodeInformation;
        }




var nodeInfo =  getNodeByNodeID(providedNodeID) // psudo code
      // any api in jstree to get nodeInfo by  providedNodeID?


       var parent_id_value = nodInfo.attr("parent_id");    
       var title_value     = nodInfo.attr("title");    
       var version_value   = nodInfo.attr("version");
       var node_name       = nodInfo.children("a").text()
alert(parent_id_value+" :: "+title_value+" :: "+version_value+" :: "+node_name);

Input : 295

Output: 192 :: node_name :: 1 :: node_name

Any help or guidance in this matter would be appreciated

Solution 1

If I'm understanding your question correctly, you can accomplish what you want to do like this:

var nodInfo = $("#" + providedNodeId);

var parent_id_value = nodInfo.attr("parent_id");    
var title_value     = nodInfo.attr("title");    
var version_value   = nodInfo.attr("version");
var node_name       = nodInfo.children("a").text();

alert(parent_id_value+" :: "+title_value+" :: "+version_value+" :: "+node_name);

Solution 2

Just want to help keep the answer up-to-date. Using jstree 3.1.0, node objects (not DOM objects) are fetched by using this code:

var treeMain;  // reference holder

$(document).ready( function () {           // when the DOM is ready
     treeMain = $('#treeMenus').jstree();  // create the tree and get the reference
});

function getNode( sNodeID)
{
    return $.jstree.reference(treeMain).get_node(sNodeID);  // use the tree reference to fetch a node
}

I've seen several answers to this question on StackOverflow that all talk about getting back to the DOM object of a tree item. I'm willing to bet that most people asking this question really want to get back to the underlying JSON data object of a tree item, which is why they say they want the node object (which has the .original property). Specifically, you need this for implementing things like "create" functionality where you need to create a new JSON data object with a ParentID that is set to the ID of the parent JSON data object. I searched for 2 days and didn't find anything clear in the jstree documentation that explained this:

$.jstree.reference(treeMain).get_node(sNodeID);

simple call. In their defense, they do have a 1 line example buried in here:

http://www.jstree.com/docs/interaction/

but it's an example most people won't care about (the user will be selecting nodes most of the time), and certainly not clear for what it is actually capable of doing. Anyways... hope this is helps save someone else a couple of days. =)

Comments

[Daniel Bidulock]

I'm happy I was able to help you.