CODEWITHSUNDEEP
javascriptjqueryjquery-pluginsjstree
Eddy Pronk
Eddy Pronk

Reputation: 6695

How do I identify a node as being a root node?

I want to create a node inside or under an existing node depending on if it is a root node. (a tree widget is usually a list of trees or a tree without a visible root node.)

I tried get_parent, but how do I know if that is a root node? 

var parent = $("#demo1").jstree('_get_parent', $("#foo"));
var node = $("#demo1").jstree('_get_node', $("#foo"));

What confused me is that get_node seems to return the same object as get_parent.

I'm using jstree_pre1.0_fix_1.

edited:

I ended up checking for the known id of the parent of the parent.

var node = $(e.replyto);
if (node.length) {
  if (node.parent().parent().attr('id') == 'demo1') {
    $("#demo1").jstree("create_node", node, 'last',{'attr': {'id':e.id}, 'state':'open', 'data': e.data}) ;
  } else {
    $("#demo1").jstree("create_node", node, 'after',{'attr': {'id':e.id}, 'state':'open', 'data': e.data}) ;
  }
} else {
    $("#demo1").jstree("create_node", -1, 'after',{'attr': {'id':e.id}, 'state':'open', 'data': e.data});
}

Upvotes: 4

Views: 12749

Answers (3)

Nada_Surf
Nada_Surf

Reputation: 616

You can call get_parent() on the node. If it returns '#' then the node is a root node. E.G:

var node = ...;

if($('#demo1').jstree(true).get_parent(node) == '#') {
    // node is a root node
}

Upvotes: 5

DavidHyogo
DavidHyogo

Reputation: 2898

I've been struggling a bit with this because I'm trying to use the context menu plugin. I don't want the user to be able to create a new root node. I only want to allow them to create sub-nodes. (The root nodes represent the groups that the current user belongs to so is pre-set by the administrator). My first confusion was that _get_children returns an object with a length property. It's not an array but it has a length property corresponding correctly to the number of actual root nodes. Looking at the underlying code, the jstree _get_children method uses jQuery's children method, which returns the child nodes with indexes 0, 1, 2 etc along with other jQuery properties and methods. I found it convenient to extract just the array of nodes and use indexOf to check if the current node is a root node. So, here is a snippet from the items property of my jstree context menu configuration:

'items': function(node){
    var rootChildren = this._get_children(-1), 
    rootNodes = [], 
    i;
    //rootChildren is now a fancy jQuery object with the child nodes assigned
    //to keys 0, 1 etc.
    //Now create a simple array
    for(i = 0; i < rootChildren.length; i += 1){
        rootNodes[i] = rootChildren[i];
    }
    //We can now use indexOf to check if the current node is in that array
    //Note again that node is a fancy jQuery object, the actual DOM element
    //is stored in node[0]
    console.log(rootNodes.indexOf(node[0]) > -1);
    //code here to add whatever items you want to the context menu.
}

If you right click around your tree, you will see true in the console window for the root nodes and false for any nodes lower down the hierarchy. Note that for IE below 8 (I think), you will need to supply an indexOf method for Array because earlier versions of IE don't supply indexOf as a native method.

Upvotes: 1

Thomas Guillory
Thomas Guillory

Reputation: 5729

It's not the ideal solution but you can use _get_children with -1 in param to get all root nodes and test if your node is in the list.

._get_children ( node )
  Use -1 to return all root nodes.

(from http://www.jstree.com/documentation/core)

Upvotes: 2

Related Questions