Question

I am learning extjs and I am curious on how to add an XTemplate inside a panel. The following code is what I have so far which works but the ‘apply’ function does not replace ‘{name}’ and ‘{age}’ with ‘smith’ nor ’21’. I am assuming I forgot to do something or maybe I’m no properly using Xtemplate. Any suggestions?

var tpl = new Ext.XTemplate('Name: {name}<br>Age: {age}');
tpl.apply({
    name:'smith',
    age:21
});
tpl.compile();


var northEastPanel = new Ext.Panel({
    flex: 1,
    autoHeight:true,
    border:false,
    frame:true,
    layout:'form',
    items:[tpl]
});

Thanks, Y_Y

Answer 1

The items config is only for Ext Components. You have to put generated html code into Panel‘s html config:

var generatedHtml = tpl.apply({
    name:'smith',
    age:21
});

var northEastPanel = new Ext.Panel({
    // not items but html:
    html: generatedHtml,
    // ...
});