jquery - issue with jsTree and child elements -


i'm using jstree create file structure visualizer in asp.net. i've found can render tree structures fine, long nodes @ root level. when incorporate child nodes, they're not rendered. i've tried using (supposedly) known-good json stackoverflow , other sites, , none of works, when copy-and-paste provided code no modifications.

i'm using jquery 1.8.0 , jstree 1.0-rc3 in visual studio 2012 on pre-existing .net 4.5 web project. scripts , uls in web user control. i've tested in ie 8, firefox 21.0 , chrome 28.0, same result.

the first tree test, based on existing menu in php application i'm porting .net.

the html straightforward:

<div class="span-24" id="treeheader">     <ul>      <li class="active"><a href="#" id="header-tab">header/trailer</a></li>      <li><a href="#" id="employee-tab">employee</a></li>      <li><a href="#" id="dependent-tab">dependent</a></li>     <li><a href="#">toggle advanced</a></li>  </ul>  

the script treeifies ul:

        jquery("#treeheader").jstree({         "plugins": ["themes", "html_data", "ui", "crrm"], // "hotkeys"],         "core": { "initially_open": ["hhtml_1"] }     }); 

so far, good. actual file structure, however, can't hardcode ul; i'm instead receiving json service , using construct ul me:

        $('#treeviewer').jstree({         "json_data": {             "data": "834 - v5010 file",             "attr": "phtml_1",             "state": "open",             "children":                 [                     {                         "data": "bgn - beginning segment",                         "attr": "phtml_2"                     },                     {                         "data": "ref - transaction set policy number",                         "attr": "phtml_3"                     },                     {                         "data": "dtp loop - file effective date",                         "attr": "phtml_4"                     },                     {                         "data": "n1 - sponsor name",                         "attr": "phtml_5"                     },                     {                         "data": "n1 - payer",                         "attr": "phtml_6"                     }                 ]         },         "themes": {             "theme": "default",             "url": "../../scripts/default/style.css",             "dots": false         },         "plugins": ["themes", "json_data", "ui", "crrm"]     }); }); 

...in empty div:

<div class="span-24" id="treeviewer">    

unfortunately, don't have enough reputation points upload image shows results, top menu shows 4 distinct elements, aligned each other, whereas second tree shows root element. i've tried variety of variations on json; simplest of bunch (in children children of 1 root node, opposed having branching structure of test data).

i don't see wrong json, , no errors being reported. there kind of processing or formatting might have make work? or potentially issue version of jstree? in advance.


Comments