add extjs 6.0.1 sources

[extjs.git] / extjs / examples / classic / platform / templates.js

Ext.require('Ext.panel.Panel');\r
\r
Ext.onReady(function(){\r
    var data = {\r
        name: 'Abe Elias',\r
        company: 'Sencha Inc',\r
        address: '525 University Ave',\r
        city: 'Palo Alto',\r
        state: 'California',\r
        zip: '44102',\r
        kids: [{\r
            name: 'Solomon',\r
            age:3\r
        },{\r
            name: 'Rebecca',\r
            age:2\r
        },{\r
            name: 'Rebecca 1',\r
            age:0\r
        }]\r
    };\r
\r
    new Ext.panel.Panel({\r
        width: 300,\r
        renderTo: 'template-example',\r
        margin: 15,\r
        bodyPadding: 5,\r
        title: 'Basic Template',\r
        tpl: [\r
            '<p>Name: {name}</p>',\r
            '<p>Company: {company}</p>',\r
            '<p>Location: {city}, {state}</p>'\r
        ],\r
        tbar: [{\r
            text: 'Apply Template',\r
            handler: function() {\r
                this.up('panel').update(data);\r
            }\r
        }],\r
        html: '<p><i>Apply the template to see results here</i></p>'\r
    });\r
\r
    new Ext.panel.Panel({\r
        width: 300,\r
        renderTo: 'xtemplate-example',\r
        margin: 15,\r
        bodyPadding: 5,\r
        title: 'XTemplate',\r
        tpl: [\r
            '<p>Name: {name}</p>',\r
            '<p>Company: {company}</p>',\r
            '<p>Location: {city}, {state}</p>',\r
            '<p>Kids: ',\r
            '<tpl for="kids">',\r
                '<tpl if="age &gt; 1"><p>{#}. {parent.name}\'s kid - {name}</p></tpl>',\r
            '</tpl></p>'\r
        ],\r
        tbar: [{\r
            text: 'Apply Template',\r
            handler: function() {\r
                this.up('panel').update(data);\r
            }\r
        }],\r
        html: '<p><i>Apply the template to see results here</i></p>'\r
    });\r
});