Title:
Navigation with jsTree: Open parent links and loading new page from leaf links
Date:
2012-10-12
Stefan Hornburg (Racke)
Navigation with jsTree: Open parent links and loading new page from leaf links
I was tasked with a hierarchical navigation for categories. Parent nodes are supposed to open the tree below and leaf nodes are supposed to take the user to a new page.
It took me a while to get acquainted with jsTree, but I managed to accomplish the following code:
<script type="text/javascript"> $(function () { $("#navtree").jstree({ "ui" : { "initially_select" : [ "nav_[cgi category_code]" ] }, "themes" : { "icons" : false }, "core" : { "initially_open" : [ "nav_[cgi category_root]" ] }, "plugins" : [ "themes", "html_data", "ui" ] }); $("#navtree").delegate("a","click", function(e) { if ($("#navtree").jstree("is_leaf", this)) { document.location.href = this; } else { $("#navtree").jstree("toggle_node", this); } }); }); </script>
Please go to the DataIdent Shop in order to see how it works.