PDA

View Full Version : How to avoid Lazy instantiation?



msuresh
30 Nov 2010, 1:06 AM
Hi,
I am extending Ext.gridpanel and calling inside tabpanel. The gridpanel is not instantiated till I click on those tabs. I would like to know how to avoid lazy instantiation.

My code looks as below:



UTP.search.SearchGridPanel = Ext.extend(Ext.grid.GridPanel, {
utpTitle:'',
frame : false,
....
initComponent : function() {
...
UTP.search.SearchGridPanel.superclass.initComponent.apply(this, arguments);
},
listeners:{
render : function(){
this.store.load();
}
},
...
...
}//eo listeners
});

UTP.search.xxxxSearchGridPanel = Ext.extend(UTP.search.SearchGridPanel, {
id : 'xxx',
title : 'xxxx',
initComponent : function() {
var me = this;
var config = {...};
Ext.apply(this, Ext.apply(this.initialConfig, config));
UTP.search.xxxxSearchGridPanel.superclass.initComponent.apply(this,arguments);
}
});

Ext.reg('utp_xxxxSearchGridPanel', UTP.search.xxxxSearchGridPanel);

var searchTabs = {
id : "stabs",
region : "center",
margins : '0 2 0 2',
border : true,
layout : 'fit',
items : [ {
xtype : "tabpanel",
border : false,
id : "searchResultTabs",
activeTab : 0,
forceLayout : true,
items : [ {xtype : 'utp_xxxxSearchGridPanel'},
{xtype : 'utp_yyySearchGridPanel'},
{xtype : 'utp_zzzSearchGridPanel'},
new UTP.search.SanViewSearchGridPanel({}); //Even this is not working...
]
} ]



Thanking you,
Suresh M R

Condor
30 Nov 2010, 1:14 AM
This is not lazy instantiation, it's lazy rendering.

Configure your tabpanel with deferredRender:false.

msuresh
30 Nov 2010, 1:26 AM
I tried its not working.

I think I need to change render in the class, i tried various events but it fails to load the grid.


listeners:{
render : function(){
this.store.load();
}

mankz
30 Nov 2010, 1:28 AM
Btw, looks like you're overnesting. Your tabpanel should be your 'center' panel in your borderlayout.

msuresh
30 Nov 2010, 1:37 AM
Thanks Condor, I had put the code deferredRender:false at wrong place, now i have corrected and everything loading as expected.

msuresh
30 Nov 2010, 1:39 AM
Thanks Mankz, now I have changed the code as per your suggestion.



var searchTabs = {
id : "stabs",
region : "center",
xtype : "tabpanel",
border : false,
deferredRender:false,
activeTab : 0,
forceLayout : true,
//FIXME: Decide based on the value in JS variable
items : [ {
xtype : 'utp_AsupSearchGridPanel'
}, {
xtype : 'utp_SapSearchGridPanel'
}, {
xtype : 'utp_LatXSearchGridPanel'
}, {
xtype : 'utp_SanViewSearchGridPanel'
} ]
};