View Full Version : How to include my XTemplate classes

12 Sep 2012, 12:00 AM

To have my html a bit seperated from the rest, I have created in the app/view directory a 'template' directory. In here I have a file called SearchListItem.js:

Ext.define('My.view.template.SearchListItem', {
extend: 'Ext.XTemplate',

constructor: function (config) {
this.callParent(['<div style="padding-left: 20px;">',
'<div style="width:100%;float:left;position:relative">{label}</div>',
'<img src="{icon}" style="float:left;position:relative;width:20px;right:20px;margin-left:-100%;height:20px;" />',
}) ;
Now in app/view I have a list defined in SearchView.js as follows

Ext.define('My.view.SearchView', {
extend: 'Ext.dataview.List',
xtype: 'mylist',
requires: [

config: {
itemTpl: new My.view.template.SearchListItem(),
loadingText : 'Loading...',

As you can see, in the list I have required the SearchListItem. Unfortunately, this doesn't work and in the browser I get the error

Uncaught TypeError: Cannot read property 'template' of undefined

Now, when I add the require statement to app.js it works. Can someone explain to me why it doesn't work in the first place ? Should I define the template directory somewhere too ?

Thanks a lot

12 Sep 2012, 8:19 PM
new My.view.template.SearchListItem()should be

12 Sep 2012, 11:15 PM
thanks, thats it!!