PDA

View Full Version : Problem when closing tabpanel



tBSTAR
11 Nov 2010, 3:27 PM
I get this error when I close a tab full of panels in debug mode. And when I turn off the debug mode, I guess all the controls inside the tab being closed under the first main tab. Is this a bug? or maybe just a race issue.
btw, I didn't have this problem when I used 3.2.1.

This is what I am using in my code to create a new tab.


var Comp = tabChecks.findById(records.data.ID);
Comp.add({ autoHeight: true, items: [new Ext.Panel({
title: json[i].PN,
autoHeight: true,
items: new Ext.grid.GridPanel({
store: store, // the datastore is defined here
cm: colModel, // the columnmodel is defined here
stripeRows: true,
width: '100%',
autoHeight: true,
title: ''
})
}), new Spacer()]
});


And this happens when I click on the close button of the tab header, I get an error in ext-all-debug line 49088

Microsoft JScript runtime error: 'this.config.length' is null or not an object



destroy : function() {
var length = this.config.length,
i = 0;

for (; i < length; i++){
this.config[i].destroy();
}
delete this.config;
delete this.lookup;
this.purgeListeners();
},

tBSTAR
9 Dec 2010, 10:18 AM
I took a break for a while but that I am back; I see this from a different perspective. This is a code snippet that's giving me grief:


var Comp = tabChecks.findById(records.data.CN);
var Panel = new Ext.Panel({id:'pnlEOB'});
for (i = 0; i < json.length; i++) {

Panel.add({ autoHeight: true, items: [
new Ext.grid.GridPanel({
store: store, // the datastore is defined here
cm: colModel, // the columnmodel is defined here
stripeRows: true,
width: '100%',
autoHeight: true,
title: json[i].PN
}), new Spacer()]
});
}
Comp.add(Panel);
tabChecks.doLayout();

When I close the tab; it closes only the first panel in the tab and rolls over the rest to the main tab. is it a race issue or the remove tab event can't determine when to close the tab properly? I just want to destroy all the items inside the tab when closed and not rolled over like phone minutes.

Fahd

Condor
10 Dec 2010, 12:28 AM
You like overnesting?

That should be:

var comp = tabChecks.findById(records.data.CN);
var items = [];
for (i = 0; i < json.length; i++) {
items.push({
xtype: 'grid',
store: store,
cm: colModel,
stripeRows: true,
anchor: '100%',
autoHeight: true,
title: json[i].PN
}, {
xtype: 'box',
anchor: '100%',
height: 10
});
}
var cont = new Ext.Container({
id:'pnlEOB',
layout: 'anchor',
items: items
});
comp.add(cont);
comp.doLayout();

tBSTAR
10 Dec 2010, 12:05 PM
I do but it's still rolling over all the remaining grids to the main tab when closing the tab. I did a count and only two panels close when I hit the x on the tab header. So, if I have 10; it will close two and move 8 over to the main tab. Weird!!

Any thoughts!

tBSTAR
13 Jan 2011, 7:54 AM
I found quickfix to my problem which is setting the panel being closed visibility to false in the beforeremove event of the tabpanel.
it works but if the panel has more 2 objects in it, it throws this error:

ext-all-debug.js
49088 destroy : function() {
49089 var length = this.config.length, <<< error: this.config is undefined
49090 i = 0;

Any ideas why would it fail on a columnModel config?

Condor
13 Jan 2011, 10:57 AM
Are you using the same columnmodel for more than one grid? That is not allowed. You need to create a separate columnmodel for each grid.

tBSTAR
14 Jan 2011, 7:16 AM
You're right Condor. Thank you for the input and I don't even need to handle the beforeremove event but it would be nice to reference one column model for more than one grid if they serve the same purpose; specially if you have a loaded ColModel with business logic. It does display the grids (about 50) in my page without a problem except when closing the tab.

Cheers...