+++ /dev/null
-<html>
- <head>
- <title>Demo using dojox.dtl._HtmlTemplated inline in DOM</title>
- <script type="text/javascript" src="../../../dojo/dojo.js"
- djConfig="isDebug: true"></script>
- <script type="text/javascript">
- dojo.require("dojox.dtl.html");
- dojo.require("dojox.dtl.Context");
-
- dojo.addOnLoad(function(){
- // Create a template from our first node (still in DOM)
- var template = new dojox.dtl.HtmlTemplate("template");
- var context = new dojox.dtl.Context({
- items: ["apple", "banana", "orange"]
- });
- // Render it first without initial item list
- template.render(context);
-
- // Create a template with our second node (removed from DOM)
- var node = dojo.byId("template2");
- node.parentNode.removeChild(node);
- var template2 = new dojox.dtl.HtmlTemplate(node);
- // The render function returns a buffer, which has the getRootNode function
- dojo.body().appendChild(template2.render(context).getRootNode());
-
- // The re-render each with a new item
- setTimeout(function(){
- context.items.push("guava");
- template.render(context);
- template2.render(context);
- }, 3000);
- });
- </script>
- </head>
- <body>
- <ul id="template">
- {% for item in items %}
- <li>{{ item }}</li>
- {% endfor %}
- </ul>
-
- <ul id="template2">
- {% for item in items reversed %}
- <li>{{ item }}</li>
- {% endfor %}
- </ul>
- </body>
-</html>
projects / eow / blobdiff