XTemplate function not getting called.

[raghuprassad]

Hi Team,

I am trying to call a XTemplate function on my panel using the panel id, but its not getting called.
I am passing an Array of records into a function and that function containing the XTemplates, i need to print the Array values in a table XTemplates function is not getting called.Although the method containing the XTemplate printing the Array record on console. Here is my code:



items : [{
height:'330',
id:'statusId',
tpl:'statusTpl',
flex : 6,
frameHeader:false,
bodyStyle:'border-top:none;border-bottom:none;border-left:none;border-right:none;',
unstyled : true,
padding: '0 20 0 0'
}],
statusDataLoad: function(records) {
console.log(records[0].get('impact'));
var statusTpl = new Ext.XTemplate(
'<h1>Test</h1>',
'<table align="top"><tr>',
'<tpl for=".">',
'<td ><b>{0}</b></td></tr>',
'</tpl>',
'</table>'
);
statusTpl.overwrite(Ext.getCmp('statusId').body,records);
},
});


I am calling the function statusDataLoad: function(records) from controller, function is getting called.
I have written the first line of XTemplate function '<h1>Test</h1>', even it is not getting printed, Please help me out to figure out the mistake i am making.

[renku]

To render a template inside a component you should simply use the View component (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.view.View). This will be much simpler than attempting to render the template directly inside the DOM of some panel.

[metalinspired]

I would use Panel (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.panel.Panel) instead

[raghuprassad]

Hi renku,
Thanks for your reply,
Can you please help me to figure out what mistake i am doing in the code. Since i am very new to ext js,
Can you please share some code to calling a Xtemplate within a function on a panel.

[raghuprassad]

Hey please help me to call a XTemplate within a function on panel.

[metalinspired]

renku already pointed out. Don't try to render XTemplate to regular DOM element. Instead create a Ext.panel.Panel and apply XTemplate to it. Read on this (http://docs.sencha.com/ext-js/4-1/#!/api/Ext.panel.Panel-cfg-tpl) first, if you haven't already.

[sword-it]

Hi raghu,



Ext.getCmp('statusId')


Looks like you have not getting the above component, You must debug above line in your browser console.
Here is Working sample example - http://jsfiddle.net/maneeshgo/d4EcW/