Expand jsTree node when parent is clicked

John 'Mark' Smith picture John 'Mark' Smith · Apr 14, 2014 · Viewed 15.5k times · Source

I am trying to implement a very simple tree using jsTree. I have found the documentation dense and overwhelming.

Right now, I expand / collapse a node by clicking the arrow shown here:

enter image description here

I want to be able to expand / collapse by clicking the node name too:

enter image description here

The code I am using is simple; I have not altered the javascript for jsTree:

<ul id="tree">
   <li>
      SubFolder1
      <ul id="tree">
         <li data-jstree='{"icon":"/Images/blue-folder.png"}'>Pub 1</li>
      </ul>
   </li>
</ul>

Answer

itmuckel picture itmuckel · Oct 3, 2015
$('#tree').on('select_node.jstree', function (e, data) {
    data.instance.toggle_node(data.node);
});

That worked for me. oerls solution did not.