How to hide root node from jsTree?

Question

[#1] I want to hide root node from jstree ?

I appended few sub-root node to "Root" node so I want to hide root node from jsTree ?

After applying following CSS To hide root node , Look n feel issue came in IE8 :

    $("ul:contains('Root')").css('position','relative');
    $("ul:contains('Root')").css('top','-20px');
    $("ul:contains('Root')").css('left','-20px');

[#2] In following core plugin,

I provided hard coded value(Root_ID) for Root node to open Root node Initially, It works fine

"core" : { initially_open" : [ "Root_ID" ] }

Root nodes ID may vary RootID, RID, Root_id, R_ID..... as we are providing different xml response.

Psudo code something like:

"core" : { initially_open" : [ **1st_node_of_Tree_like_(ul > li:first)_OR_$(".jstree-last").first()** ] }

How I can achieve this 2 things?

Any help or guidance in this matter would be appreciated.

Answer 1

It's a little counterintuitive but best way to create a tree with no explicit root node is to not provide any root node in the data, and make all the children of the root node have parent "#". jstree will render a tree with multiple top level children of the root. Avoids any messiness with trying to hide the root.

Answer 2

I found very Simple answer :)

$("#treeViewDiv").bind("loaded.jstree", 
 function (event, data) {
       // To hide root nodes text
       $("a:contains('Root')").css("visibility","hidden")  
       // Need to find other way to hide rootNodeName Any1 knows ?

       // To hide - icon
       $(".jstree-last .jstree-icon").first().hide()
  });