Jquery Dynatree Example - Jquery
How to create dynamic javascript tree?
Snippet Code
Rate this page :
|
[ 0 votes]
|
Dynatree allows you to have control with support over check box, drag and drop and lazy loading. Here the simple code using dynamic tree is given below
<script src="https://raw.githubusercontent.com/mar10/dynatree/master/jquery/jquery.js"></script>
<script src='https://raw.githubusercontent.com/mar10/dynatree/master/jquery/jquery-ui.custom.js' type="text/javascript"></script>
<script src='https://raw.githubusercontent.com/mar10/dynatree/master/jquery/jquery.cookie.js' type="text/javascript"></script>
<link href="https://raw.githubusercontent.com/mar10/dynatree/master/src/skin/ui.dynatree.css" rel="stylesheet" type="text/css" id="skinSheet">
<script src='https://raw.githubusercontent.com/mar10/dynatree/master/src/jquery.dynatree.js'></script>
<script type="text/javascript">
$(function(){
$("#tree").dynatree({
onActivate: function(node) {
// alert("You activated " + node.data.title);
},
persist: true,
children: [
{title: "Folder 1", isFolder: true,
children: [
{title: "Sub-menu 1.1"},
{title: "Sub-menu 1.2"},
{title: "Sub-menu 1.3"}
]
},
{title: "Folder 2", isFolder: true,
children: [
{title: "Sub-menu 2.1"},
{title: "Sub-menu 2.2"}
]
},
{title: "Folder 3", isFolder: true,
children: [
{title: "Sub-menu 3.1"},
{title: "Sub-menu 3.2"}
]
}
]
});
});
</script>
<div id="tree"> </div>
