+++ /dev/null
-<html>\r
-<head>\r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js">Ext.onReady(function(){\r
-\r
- var data = {\r
- name: 'Jack Slocum',\r
- company: 'Ext JS, LLC',\r
- address: '4 Red Bulls Drive',\r
- city: 'Cleveland',\r
- state: 'Ohio',\r
- zip: '44102',\r
- kids: [{\r
- name: 'Sara Grace',\r
- age:3\r
- },{\r
- name: 'Zachary',\r
- age:2\r
- },{\r
- name: 'John James',\r
- age:0\r
- }]\r
- };\r
-\r
- var p = new Ext.Panel({\r
- title: 'Basic Template',\r
- width: 300,\r
- html: '<p><i>Apply the template to see results here</i></p>',\r
- tbar: [{\r
- text: 'Apply Template',\r
- handler: function(){\r
-\r
- var tpl = new Ext.Template(\r
- '<p>Name: {name}</p>',\r
- '<p>Company: {company}</p>',\r
- '<p>Location: {city}, {state}</p>'\r
- );\r
-\r
- tpl.overwrite(p.body, data);\r
- p.body.highlight('#c3daf9', {block:true});\r
- }\r
- }],\r
-\r
- renderTo: document.body\r
- });\r
-\r
-\r
- var p2 = new Ext.Panel({\r
- title: 'XTemplate',\r
- width: 300,\r
- html: '<p><i>Apply the template to see results here</i></p>',\r
- tbar: [{\r
- text: 'Apply Template',\r
- handler: function(){\r
-\r
- var tpl = new Ext.XTemplate(\r
- '<p>Name: {name}</p>',\r
- '<p>Company: {company}</p>',\r
- '<p>Location: {city}, {state}</p>',\r
- '<p>Kids: ',\r
- '<tpl for="kids" if="name==\'Jack Slocum\'">',\r
- '<tpl if="age > 1"><p>{#}. {parent.name}\'s kid - {name}</p></tpl>',\r
- '</tpl></p>'\r
- );\r
- tpl.overwrite(p2.body, data);\r
- p2.body.highlight('#c3daf9', {block:true});\r
- }\r
- }],\r
-\r
- renderTo: document.body\r
- });\r
-});</pre> \r
-</body>\r
-</html>
\ No newline at end of file