Last active
December 19, 2015 14:59
-
-
Save kachar/5973305 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta http-equiv="content-type" content="text/html; charset=utf-8"> | |
<title>Test case | Fancytree</title> | |
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css"> | |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script> | |
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js" type="text/javascript"></script> | |
<link href="../../src/skin-win7/ui.fancytree.css" rel="stylesheet" type="text/css"> | |
<script src="../../src/jquery.fancytree.js" type="text/javascript"></script> | |
<!-- Start_Exclude: This block is not part of the sample code --> | |
<link href="../../lib/prettify.css" rel="stylesheet"> | |
<script src="../../lib/prettify.js" type="text/javascript"></script> | |
<link href="../../demo/sample.css" rel="stylesheet" type="text/css"> | |
<script src="../../demo/sample.js" type="text/javascript"></script> | |
<!-- End_Exclude --> | |
<style type="text/css"> | |
</style> | |
<!-- Add code to initialize the tree when the document is loaded: --> | |
<script type="text/javascript"> | |
$(function(){ | |
// Adjust skinswitcher for current folder layout | |
$("select#skinswitcher").skinswitcher("option", "base", "../../src/"); | |
var treeData = [ | |
{title: "Item 1", key: "node1"}, | |
{title: "Folder 2", folder: true, expanded: true, key: "node2", | |
children: [ | |
{title: "Sub-item 2.1", key: "node2.1", selected: true}, | |
{title: "Sub-item 2.2", key: "node2.2", selected: true} | |
] | |
}, | |
{title: "Folder 3", folder: true, expanded: true, key: "node3", | |
children: [ | |
{title: "Sub-item 2.1", key: "node2.1", selected: false, | |
children: [ | |
{title: "Sub-item 2.1.1", key: "node2.1.1", selected: true}, | |
{title: "Sub-item 2.1.2", key: "node2.1.2", selected: true} | |
] | |
}, | |
{title: "Sub-item 2.2", key: "node2.2", selected: true} | |
] | |
}, | |
{title: "Folder 4", folder: true, expanded: true, key: "node3", | |
children: [ | |
{title: "Sub-item 4.1", key: "node4.1", expanded: true, selected: true, | |
children: [ | |
{title: "Sub-item 4.1.1", key: "node4.1.1", selected: false}, | |
{title: "Sub-item 4.1.2", key: "node4.1.2", selected: false} | |
] | |
}, | |
{title: "Sub-item 4.2", key: "node2.2", selected: true} | |
] | |
}, | |
{title: "Folder 5", folder: true, expanded: true, key: "node5", | |
children: [ | |
{title: "Sub-item 2.1", key: "node2.1", selected: true}, | |
{title: "Sub-item 2.2", key: "node2.2", selected: false} | |
] | |
}, | |
{title: "Item 3", key: "node3", lazy: true} | |
]; | |
// Initialize Fancytree | |
$("#tree").fancytree({ | |
checkbox: true, | |
selectMode: 3, | |
source: [], | |
lazyload: function(event, ctx) { | |
ctx.result = [ | |
{title: "Folder 3", folder: true, expanded: true, key: "node3", | |
children: [ | |
{title: "Sub-item 2.1", key: "node2.1", selected: false, | |
children: [ | |
{title: "Sub-item 2.1.1", key: "node2.1.1", selected: true}, | |
{title: "Sub-item 2.1.2", key: "node2.1.2", selected: false} | |
] | |
}, | |
{title: "Sub-item 2.2", key: "node2.2", selected: true} | |
] | |
}, | |
]; | |
ctx.tree.rootNode.fixSelection3FromEndNodes(); | |
}, | |
init: function(event, ctx) { | |
ctx.tree.debug("init"); | |
ctx.tree.rootNode.fixSelection3FromEndNodes(); | |
}, | |
loadchildren: function(event, ctx) { | |
ctx.tree.debug("loadchildren"); | |
ctx.node.fixSelection3FromEndNodes(); | |
} | |
}); | |
$("#tree").fancytree("getRootNode").addChildren(treeData); | |
}); | |
</script> | |
<!-- Start_Exclude: This block is not part of the sample code --> | |
<script> | |
$(function(){ | |
/* | |
addSampleButton({ | |
label: "Generate <input> elements", | |
code: function(){ | |
$("#tree").fancytree("getTree").generateInput(); | |
$("#tree2").fancytree("getTree").generateInput(); | |
} | |
}); | |
*/ | |
}); | |
</script> | |
<!-- End_Exclude --> | |
</head> | |
<body class="example"> | |
<h1>Testcase for issue #XXX</h1> | |
<div class="description"> | |
</div> | |
<div> | |
<label for="skinswitcher">Skin:</label> <select id="skinswitcher"></select> | |
</div> | |
<hr> | |
<div id="tree"> | |
</div> | |
<!-- Start_Exclude: This block is not part of the sample code --> | |
<p id="sampleButtons"> | |
</p> | |
<hr> | |
<p class="sample-links no_code"> | |
<a class="hideInsideFS" href="http://dynatree.googlecode.com">jquery.dynatree.js project home</a> | |
<a class="hideOutsideFS" href="#">Link to this page</a> | |
<a class="hideInsideFS" href="index.html">Example Browser</a> | |
<a href="#" id="codeExample">View source code</a> | |
</p> | |
<pre id="sourceCode" class="prettyprint" style="display:none"></pre> | |
<!-- End_Exclude --> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment