PDA

View Full Version : tpl not working in panel



nofx
24 Aug 2011, 4:16 AM
Hi,

I'm trying to fill a tpl in a Panel, but it's not working. I have the following code:


/* Create model and store */
app.models.locations = Ext.regModel('app.models.locations', {
fields: ['name', 'email']
});


app.stores.store = new Ext.data.JsonStore({
model : 'app.models.locations',
getGroupString : function(record) {
return record.get('name')[0];
},
});

/* Add something in the model/store */
var rank = Ext.ModelMgr.create({
name: 'aaa',
email: 'em@il.com'
}, 'app.models.locations');

app.stores.store.add(rank);

/* Create tpl */
var test = new Ext.XTemplate('template goes here {name}');

app.views.main = Ext.extend(Ext.Panel, {

items: [{
xtype:'panel',
store: app.stores.store,
tpl: test
}],
html:'content'


As you can see i'm creating a model/store, fill it with 1 item and after that i'm trying to output it as a TPL in that Panel. But it doesn't print the TPL content at all.

It does work however, when i change the xtype to 'list' and 'tpl' to 'itemTpl', Unfortunately i don't need a list but i need to display the tpl in a Panel.

Anyone any idea what i'm doing wrong??

nofx
24 Aug 2011, 5:01 AM
I got a bit further, i change a few lines of code in the Panel:


// Create model and store
app.models.locations = Ext.regModel('app.models.locations', {
fields: ['name', 'email']
});


app.stores.store = new Ext.data.JsonStore({
model : 'app.models.locations',
getGroupString : function(record) {
return record.get('name')[0];
},
});

// Add something in the model/store
var rank = Ext.ModelMgr.create({
name: 'namehere',
email: 'em@il.com'
}, 'app.models.locations');

app.stores.store.add(rank);

// Create tpl
var test = new Ext.XTemplate('Hello, {name}!');

app.views.main = Ext.extend(Ext.Panel, {

items: [{
xtype:'panel',
//store: app.stores.store,
tpl: test,
data: app.stores.store,
id: 'main.inner'
}],
id: 'main.outer',
html:'content'

});


Instead of using store: i'm using data:
It does work, i see that one line is printed from my tpl. But i expected to see this:
Hello, namehere!

But instead i get,
Hello, !

So it doesn't see take the variables in the tpl.

nofx
24 Aug 2011, 5:26 AM
Well, maybe its not working at all. When i try to display 2 rows (eventhough its not picking up the {variables}), i still get 1 row...

To display 2 rows i just simply added two items to the store:


// Add something in the model/store
var rank = Ext.ModelMgr.create({
name: 'aaa',
email: 'em@il.com'
}, 'app.models.locations');

app.stores.store.add(rank);


var rank = Ext.ModelMgr.create({
name: 'bbb',
email: 'ema@il.com'
}, 'app.models.locations');

app.stores.store.add(rank);


But its still not working... I'm so clueless why this is happening...

JackThor
2 Jan 2013, 8:13 PM
Were you able to find a solution to this? I am stuck where you are too.