How to load child node in jsTree
Sorry for my poor English, my system want to change javascript tree from KoolTreeView to jsTree and I read the document and implement it. The result is something like this
Food
* Fish
* Beef
*开发者_StackOverflow Chicken
my javascript and div code
<script class="source" type="text/javascript">
$(function () {
$("foodtree").jstree({
"core" : { "initially_open" : [ "root" ] },
"html_data" : {
"ajax" : {
"url" : "menu/menu/listfoodtree"
}
},
"plugins" : [ "themes", "html_data" ]
});
});
</script>';
<div id="foodtree"></div>
About url of “menu/menu/listfoodtree” created plain html:
<li id="root"><span>Food</span>
<ul>
<li id="food14"><a href="menu/menu/listfish/1">Fish</a></li>
<li id="food13"><a href="menu/menu/listbeef/1/13">Beef</a></li>
<li id="food1"><a href="menu/menu/listchick/11">Chicken</a></li>
</ul>
</li>
the result displayed correctly (with jsTree) and my ideal want to click the item to load child node like this
# Food
* Fish (href='/menu/menu/listfish/1')
* Tuna
* Salmon
* Beef
* Chicken
and now I have the url “/menu/menu/listfish/1” created plain html:
<li id ='fish44'><span>Tuna</span></li>
<li id ='fish66'><span>Salmon</span></li>
but I don't know how to implement it, to click the Fish and display the child node from url. Could you give me any suggestion or guidance?
You specify the ajax url in the tree heading which passes the nodeid as a parameter. Using that nodeid you should pass back your new json for that node and the tree will add it as children to the selected node.
The parent nodes have to have their state defined in the json as "state":"open" or the tree won't make a call to the server.
You can't specify a different url for each node, but what you could do is specify a main url for the tree and redirect the server page to the url you would like to get the data from.
精彩评论