Updated
This commit is contained in:
48
master/examples/demo_Tree.html
Normal file
48
master/examples/demo_Tree.html
Normal file
@@ -0,0 +1,48 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>Demo to show recursion in DTL</title>
|
||||
<script type="text/javascript" src="../../../dojo/dojo.js"
|
||||
djConfig="isDebug: true, parseOnLoad: true"></script>
|
||||
<script type="text/javascript">
|
||||
dojo.require("dijit._WidgetBase");
|
||||
dojo.require("dojox.dtl._DomTemplated");
|
||||
dojo.require("dojo.data.ItemFileReadStore");
|
||||
dojo.require("dojo.parser");
|
||||
|
||||
(function(){
|
||||
var data = {};
|
||||
|
||||
// The only way to get ItemFileReadStore to work
|
||||
// synchronously (necessary for the bind_query format
|
||||
// we'll be using below) at the time of this writing
|
||||
// was to feed it data
|
||||
dojo.xhrGet({
|
||||
url: dojo.moduleUrl("dijit.tests._data", "countries.json"),
|
||||
handleAs: "json",
|
||||
sync: true,
|
||||
load: function(json){
|
||||
data = json;
|
||||
}
|
||||
});
|
||||
|
||||
dojo.declare("demo.Tree", [dijit._WidgetBase, dojox.dtl._DomTemplated], {
|
||||
constructor: function(){
|
||||
this.disabled = {};
|
||||
},
|
||||
toggle: function(e){
|
||||
var dataid = dojo.attr(e.target, "dataid");
|
||||
this.disabled[dataid] = !this.disabled[dataid];
|
||||
this.render();
|
||||
},
|
||||
store: new dojo.data.ItemFileReadStore({ data: data }),
|
||||
query: { type: "continent" },
|
||||
templateString: '{% load dojox.dtl.contrib.objects %}{% load dojox.dtl.contrib.data %}{% bind_query query to store as countries %}<ul dojoAttachEvent="onclick: toggle">{% for country in countries %}{% include countrychildren %}{% endfor %}</ul>',
|
||||
countrychildren: '<li dataid="{{ country.getIdentity }}">{{ country.type }}: {{ country.name }}{% if country.children %}{% if disabled|key:country.getIdentity %} ↵{% else %}<ul>{% for country in country.children %}{% include countrychildren %}{% endfor %}</ul>{% endif %}{% endif %}</li>'
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div dojoType="demo.Tree"></div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user