You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
69 lines
2.8 KiB
69 lines
2.8 KiB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" |
|
"http://www.w3.org/TR/html4/strict.dtd"> |
|
<html lang="en"> |
|
<head> |
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> |
|
<title>Dijit Tree V1 API Test</title> |
|
|
|
<style type="text/css"> |
|
@import "../../themes/claro/document.css"; |
|
@import "../css/dijitTests.css"; |
|
</style> |
|
|
|
<!-- required: the default dijit theme: --> |
|
<link id="themeStyles" rel="stylesheet" href="../../../dijit/themes/claro/claro.css"/> |
|
|
|
<!-- required: dojo.js --> |
|
<script type="text/javascript" src="../../../dojo/dojo.js" |
|
data-dojo-config="isDebug: true, parseOnLoad: true"></script> |
|
|
|
<!-- only needed for alternate theme testing: --> |
|
<script type="text/javascript" src="../_testCommon.js"></script> |
|
|
|
<script type="text/javascript"> |
|
dojo.require("dijit.dijit"); // optimize: load dijit layer |
|
dojo.require("dojo.data.ItemFileReadStore"); |
|
dojo.require("dijit.Tree"); |
|
dojo.require("dijit.ColorPalette"); |
|
dojo.require("dojo.parser"); // scan page for widgets and instantiate them |
|
</script> |
|
</head> |
|
<body class="claro" role="main"> |
|
|
|
<h1 class="testTitle">Dijit Tree V1 API Test</h1> |
|
<p> |
|
This file is for testing the old Tree API's, where the store is specified directly |
|
rather than specifying a model which connects to a store. |
|
</p> |
|
<div dojoType="dojo.data.ItemFileReadStore" jsId="continentStore" |
|
url="../_data/countries.json"></div> |
|
|
|
<h3>Tree with hardcoded root node (not corresponding to any item in the store)</h3> |
|
<p>Clicking a folder node will open/close it (openOnclick==true), and clicking a leaf node will change the display name of the leaf node.</p> |
|
<div dojoType="dijit.Tree" id="mytree" store="continentStore" query="{type:'continent'}" |
|
onfocus="console.log('user focus handler')" |
|
onblur="console.log('user blur handler')" |
|
label="Continents" openOnClick="true" persist="false"> |
|
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="item"> |
|
this.getNodesByItem(item)[0].labelNode.innerHTML=item.name[0] + " was clicked"; |
|
</script> |
|
</div> |
|
|
|
<button onclick="dijit.byId('mytree').destroyRecursive();">destroy</button> |
|
|
|
<h2>A rootless tree (no "continents" node) with custom icons</h2> |
|
|
|
<div dojoType="dijit.Tree" id="tree2" store="continentStore" query="{type:'continent'}" persist="false"> |
|
<script type="dojo/method" event="getIconClass" args="item, opened"> |
|
return (!item || continentStore.getValue(item, "type") == "continent") ? |
|
(opened ? "customFolderOpenedIcon" : "customFolderClosedIcon") : |
|
"noteIcon"; |
|
</script> |
|
<script type="dojo/method" data-dojo-event="onClick" data-dojo-args="item"> |
|
this.getNodesByItem(item)[0].labelNode.innerHTML = item.name[0] |
|
+ " (population: " + continentStore.getValue(item, "population") +")"; |
|
</script> |
|
</div> |
|
|
|
</body> |
|
</html>
|
|
|