| Line | |
|---|
| 1 | <html> |
|---|
| 2 | <head> |
|---|
| 3 | <title>Demo using dojox.dtl._DomTemplated inline in DOM</title> |
|---|
| 4 | <script type="text/javascript" src="../../../dojo/dojo.js" |
|---|
| 5 | djConfig="isDebug: true, parseOnLoad: true"></script> |
|---|
| 6 | <script type="text/javascript"> |
|---|
| 7 | dojo.require("dojo.parser"); |
|---|
| 8 | dojo.require("dojox.dtl.Inline"); |
|---|
| 9 | dojo.require("dojox.dtl.DomInline"); |
|---|
| 10 | |
|---|
| 11 | gContext = {items: ["apple", "banana", "orange"]}; |
|---|
| 12 | |
|---|
| 13 | dojo.addOnLoad(function(){ |
|---|
| 14 | // The Re-render each with a new item |
|---|
| 15 | setTimeout(function(){ |
|---|
| 16 | var inline = dijit.byId("inline"); |
|---|
| 17 | inline.context.items.push("guava"); |
|---|
| 18 | inline.render(); |
|---|
| 19 | var dominline = dijit.byId("dominline"); |
|---|
| 20 | dominline.context.items.push("pineapple"); |
|---|
| 21 | dominline.render(); |
|---|
| 22 | |
|---|
| 23 | setTimeout(function(){ |
|---|
| 24 | // You can define an altogether new context in either of the following ways |
|---|
| 25 | inline.context = {items: ["lions", "tigers", "bears"]}; |
|---|
| 26 | inline.render(); |
|---|
| 27 | dominline.render({items: ["duck", "chicken", "turkey"]}); |
|---|
| 28 | }, 3000); |
|---|
| 29 | }, 3000); |
|---|
| 30 | }); |
|---|
| 31 | </script> |
|---|
| 32 | </head> |
|---|
| 33 | <body> |
|---|
| 34 | <script type="text/html" dojoType="dojox.dtl.Inline" id="inline" context="{items: ['apple', 'banana', 'orange']}"> |
|---|
| 35 | <ul> |
|---|
| 36 | {% for item in items %} |
|---|
| 37 | <li>{{ item }}</li> |
|---|
| 38 | {% endfor %} |
|---|
| 39 | </ul> |
|---|
| 40 | </script> |
|---|
| 41 | |
|---|
| 42 | <!-- Use the DOM-based version with an external context --> |
|---|
| 43 | <script type="text/html" dojoType="dojox.dtl.DomInline" id="dominline" context="gContext"> |
|---|
| 44 | <ul> |
|---|
| 45 | {% for item in items %} |
|---|
| 46 | <li>{{ item }}</li> |
|---|
| 47 | {% endfor %} |
|---|
| 48 | </ul> |
|---|
| 49 | </script> |
|---|
| 50 | </body> |
|---|
| 51 | </html> |
|---|
Note: See
TracBrowser
for help on using the repository browser.
