summaryrefslogtreecommitdiff
path: root/js/dojo/dojox/dtl/demos/demo_Templated_amd.html
blob: 7235aac6400ddbb7e141f4311ae6c534694e9720 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<html>
	<head>
			<title>Demo using dojox.dtl._Templated</title>
	    <script type="text/javascript" src="../../../dojo/dojo.js"
				data-dojo-config="isDebug: true, parseOnLoad: true, async:true"></script>
	    <script type="text/javascript">
			require(["dijit/_WidgetBase",
					 "dojox/dtl/_Templated",
					 "dojo/_base/array",
					 "dojo/_base/declare",
					 "dojo/query",
					 "dojo/keys",					 
					 "dojo/parser",
					 "dojox/dtl/tag/logic"], 
					 function(_WidgetBase, _Templated, array, declare, query, keys){

						declare("Fruit", [_WidgetBase, _Templated], {
							oldRepl: "Fruit: ",
							_dijitTemplateCompat: true,
							items: ["apple", "banana", "orange"],
							keyUp: function(e){
								if(e.keyCode == keys.ENTER){
									var i = array.indexOf(this.items, e.target.value);
									if(i != -1){
										this.items.splice(i, 1);
									}else{
										this.items.push(e.target.value);
									}
									e.target.value = "";
									this.render();
									query("input", this.domNode).forEach("item.focus();");
								}
							},
							templateString: '<div><input dojoAttachEvent="onkeyup: keyUp"><ul>{% for item in items %}<li>${oldRepl} {{ item }}</li>{% endfor %}</ul></div>'
						});
			});
	    </script>
	</head>
	<body>
		<div data-dojo-type="Fruit"></div>
	</body>
</html>