tpl not working in panel

[nofx]

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]

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]

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]

Were you able to find a solution to this? I am stuck where you are too.