Fancytree - Embed Default
HTML
<link rel="stylesheet" href="https://rawgit.com/mar10/fancytree/master/src/skin-win8/ui.fancytree.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="https://rawgit.com/mar10/fancytree/master/src/jquery.fancytree.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.fancytree/2.19.0/jquery.fancytree-all.min.js"></script>
<div id="tree"></div>
<div id="statusLine">-</div>
<p>
<button id="button1">Select item2</button>
</p>
JavaScript
$(function() {
$("#tree").fancytree({
checkbox: false,
source: [{
"ishaveresults": false,
"folder": true,
"title": "Deneme 1",
"processId": "46ffe39b-e20b-e811-80d4-005056a543f8",
"parentprocessid": null,
"children": [{
"ishaveresults": false,
"folder": true,
"title": "Deneme 1.1",
"processId": "db32b6b0-e20b-e811-80d4-005056a543f8",
"parentprocessid": "46ffe39b-e20b-e811-80d4-005056a543f8",
"children": [{
"ishaveresults": true,
"folder": false,
"title": "Deneme 1.1.1",
"processId": "d58084f3-fe0b-e811-80d4-005056a543f8",
"parentprocessid": "db32b6b0-e20b-e811-80d4-005056a543f8",
"results": [{
"title": "Deneme 1.1.1",
"processId": "d58084f3-fe0b-e811-80d4-005056a543f8",
}]
}]
}]
},
{
"ishaveresults": false,
"folder": true,
"title": "Deneme 2",
"processId": "bb94bfbc-e20b-e811-80d4-005056a543f8",
"parentprocessid": null,
"children": [{
"ishaveresults": false,
"folder": false,
"title": "Deneme 2-1",
"processId": "3d253bc7-e20b-e811-80d4-005056a543f8",
"parentprocessid": "bb94bfbc-e20b-e811-80d4-005056a543f8"
}]
}
],
activate: function(event, data) {
$("#statusLine").text(event.type + ": " + data.node);
},
select: function(event, data) {
$("#statusLine").text(event.type + ": " + data.node.isSelected() + " " + data.node.title);
}
});
// Activate a node, on button click
$("#button1").click(function() {
var tree = $("#tree").fancytree("getTree"),
node = tree.getNodeByKey("id2");
node.toggleSelected();
});
});