jsTree Open a branch

问题:

I am using the JQuery plugin jsTree, http://www.jstree.com/ I am able to expand the whole tree with the following method:

$("#tree").jstree("open_all"); 

and also a specific node:

$("#tree").jstree("open_node", $('#childNode')); 

I am having difficulty opening a branch of the tree, open branch opens it fine but does not open its parent if it has one.

Has anyone successully done this with jsTree? Let me know if you need more info.

Thanks

Eef

回答1:

You could use the binding

$("#tree").bind("open_node.jstree", function (event, data) {    if((data.inst._get_parent(data.rslt.obj)).length) {      data.inst._get_parent(data.rslt.obj).open_node(this, false);    }  });  

回答2:

Your code for open branch is correct.

For example. Source of tree:

    <div id="treeTask">        <ul>           <li id="node_37"><a href="#">TEST1</a>               <ul>                   <li id="node_38"><a href="#">TEST2</a></li>                   <li id="node_39"><a href="#">TEST3</a></li>               </ul>           </li>       </ul>    </div> 

Open node:

$("#treeTask").jstree("open_node", $("#node_38")); 

回答3:

Try this code to open node till nth Level

$("#myTree").jstree({options}).bind('loaded.jstree', function (e, data) {     /**       * Open nodes on load (until x'th level)       */     var depth = 3;     data.inst.get_container().find('li').each(function (i) {         if (data.inst.get_path($(this)).length <= depth) {             data.inst.open_node($(this));         }     }); }); 

回答4:

Here is function that can open a specific node and all its parents.

function expandNode(nodeID) {     // Expand all nodes up to the root (the id of the root returns as '#')     while (nodeID != '#') {         // Open this node         $("#jstree").jstree("open_node", nodeID)         // Get the jstree object for this node         var thisNode = $("#jstree").jstree("get_node", nodeID);         // Get the id of the parent of this node         nodeID = $("#jstree").jstree("get_parent", thisNode);     } } 

回答5:

i found Ted's code working, but had to change it a bit:

 $('#jsTree').bind("open_node.jstree", function (event, data) {        if((data.inst._get_parent(data.rslt.obj)).length) {          data.inst.open_node(data.inst._get_parent(data.rslt.obj), false,true);        }      }); 

回答6:

just use this if you use json

$("#treeId").on ('loaded.jstree', function() {  $("#treeId").jstree("open_node", $("#nodeId"));  }); 

回答7:

    // Expand pasted, dragged and dropped node for jstree 3.3.1         var objtree = $('#jstree');         objtree.bind('paste.jstree', function(e, d) { objtree.jstree('open_all', '#' + d.parent); });         $(document).bind('dnd_move.vakata', function(e, d) { objtree.jstree('open_all', $(d.event.target).closest('.jstree-node').attr('id')); });         $(document).bind('dnd_stop.vakata', function(e, d) { objtree.jstree('open_all', $(d.event.target).closest('.jstree-node').attr('id')); }); 

回答8:

None of previous worked for me, so I have created this code, and it works like a charm :)

$('#tree').on('open_node.jstree', function (event, data) {      if(data.node.parent !== "#") {          data.instance.open_node(data.node.parent);      }  }); 

文章来源: jsTree Open a branch