PDA

View Full Version : panel and tpl ERROR!



alberto01
2 Nov 2010, 11:41 AM
Hi again,
i'm getting crazy withi this error and I can' t understand....
I have this code:


infoUi = Ext.extend(Ext.Panel, {
layout: 'hbox',
ref: 'info',
initComponent: function() {
this.defaults = {
margins: '10 10 10 10'
};
this.items = [
{
xtype: 'panel',
id: 'prod',
ref: 'prod',
height: 280,
tpl: '<p>{city}</p>'
}
];
infoUi.superclass.initComponent.call(this);
}
});

I'm trying to update the panel in this way:


info = Ext.extend(infoUi, {

[.....]

getData: function(anag_id){
var data = {datas: [
{name: 'Jack Slocum',
title: 'Lead Developer',
company: 'Ext JS, LLC',
email: '[email protected]',
address: '4 Red Bulls Drive',
city: 'Cleveland',
state: 'Ohio',
zip: '44102'
}]};
console.dir(data);
this.getComponent('prod').update(data.datas);
},

But i get this error:
this.tpl[this.tplWriteMode] is not a function

I searched in google but nothing ... where do i wrong?
thanks in advance

alberto01
2 Nov 2010, 12:20 PM
Ok guis I found the mistake!
I have to call the update after the layout has been drawed!
So I added theese lines to my getData function:


this.getComponent('prod').on('afterlayout', function(){
var data =
{name: 'Jack Slocum',
title: 'Lead Developer',
company: 'Ext JS, LLC',
email: '[email protected]',
address: '4 Red Bulls Drive',
city: 'Cleveland',
state: 'Ohio',
zip: '44102'
};
this.getComponent('prod').update(data);
}, this)



Sorry for the useless post, however I hope it will help someone ... .bye

Condor
3 Nov 2010, 4:31 AM
Don't forget to add a {single:true} to the afterlayout event, otherwise it will fire again when the component is resized.

alberto01
3 Nov 2010, 5:41 AM
Tnx for the suggestion.
But now I have a side effect ...

When I call the getData function after that the panel is rendered, obviously, it doesn't fire again the event.

Since I call the getData on a "rowselect" event of a grid, how can I call the update() again?

I explain you better:

I have a grid, and a tabpanel.
On the rowselect of the grid I call the getData for all the panel of the tabpanel (5 in total)
something like:
this.ref1.getData(rec.myId);
this.ref2.getData(rec.myId);
and so on....

When i call the getData of the panel with the tpl, I get the previous error if i don't wait the render of the panel.

But if change the row i need to refresh the data recalling the getData... and here I get the second problem because the panel is already rendered ...

tnx al

Condor
3 Nov 2010, 5:56 AM
Use:

var myData = ...
var comp = Ext.getCmp('prod');
comp.data = myData;
if (comp.rendered) {
comp.tpl[comp.tplWriteMode](comp.getContentTarget(), myData);
}

alberto01
3 Nov 2010, 6:06 AM
it works!!
Thank you! byez