PDA

View Full Version : Issue with doLayout()



mg2468
13 Jul 2010, 3:27 PM
Hello,

I am adding and remove panels and when i do a doLayout after adding a new panel i get this error
b.getPositionEl().dom is undefined.

Can someone please help.

13 Jul 2010, 4:44 PM
It's hard to tell exactly what you're really doing. Any way you could post a consumable code snippet?

mg2468
13 Jul 2010, 5:17 PM
Hi, thx for getting back to me quickly.

Here is the code



var existingPanel = Ext.getCmp('existingPanel');
existingPanel.remove('searchPanel');

var report = new Ext.app.Report();

var viewReportPanel = report.generateViewReportPanel(id);


existingPanel.add(viewReportPanel);

existingPanel.doLayout();


on the last line of the above code, i get the error mentioned

IN FF see error 'b.getPositionEl().dom is undefined'
But on chrome i see different error 'Uncaught TypeError: Cannot read property 'parentNode' of undefined'

Thanks

13 Jul 2010, 5:51 PM
is that inside of a region in a border layout?


Check out this screencast on containers add/remove :: http://tdg-i.com/58/containers-add-and-remove

mg2468
13 Jul 2010, 6:14 PM
No, there is no container with border layout. I used either anchor or fit.
I will check the URL that you have provide and see if it helps.

Thanks.

Animal
13 Jul 2010, 9:18 PM
generateViewReportPanel is returning something that is wrong.

Possibly a destroyed Panel.

mg2468
13 Jul 2010, 10:25 PM
Thanks for your inputs, i will verify if that is the issue.

mjhaston
6 Mar 2012, 11:07 AM
Possible similar issue. GridForm uses Grid. This is a copy of one of the binding examples. This is my first attempt at dynamically adding in scripts and adding/removing components.

I can click to load "online-reporting-script.js" and then load "../phone-system/phone-system.js" and then back ... but the second time the phone script "GridForm" is loaded i get the "b.getPosition" error.

Note: if I remove the "Grid" from the "GridForm" I can toggle back and forth all day long.



code that adds panel:



ScriptMgr.loadJs({
scripts : n.attributes.script,
debug : false,
callback : function() {
console.log(n.attributes.script + ' loaded');
wrc = Ext.getCmp('center-region-container');
wrc.removeAll(true);
// wrc.doLayout();

if (n.attributes.script == 'online-reporting-script.js') {
reportPanel = new myReportPanel({
title : 'New Average Comp',
id : 'reportPanel'
});

wrc.add(reportPanel);
wrc.show(reportPanel);
console.log('New Average Comp')

} else if (n.attributes.script == '../phone-system/phone-system.js') {

myGridForm = new gridForm({
title : 'New Phone System',
id : 'phoneSystem'
});

wrc.add(myGridForm);
wrc.show(myGridForm);
console.log('New Phone System')

} else {
wrc.add(panelMain);
wrc.show(panelMain);
panelMain.setTitle(n.id);
}
wrc.doLayout();
console.log('layout done')
}
});




code the creates grid and form:



var grid = new Ext.grid.GridPanel({
ds : ds,
cm : colModel,
frame : true,
border : true,
qtip : 'Click to select a name for details',
sm : new Ext.grid.RowSelectionModel({
singleSelect : true,
listeners : {
rowselect : function(sm, row, rec) {
Ext.getCmp("company-form").getForm().loadRecord(rec);
}
}
}),
height : 420,
border : true,
stripeRows : true,
loadMask : true,
waitMsg : 'Please wait...',
listeners : {
render : function(g) {
g.getSelectionModel().selectRow(0);
},
delay : 20
// Allow rows to be rendered.
},
tbar : [nameCombo, {
xtype : 'tbspacer',
width : 5
}, whseCombo, {
xtype : 'tbspacer',
width : 5
}, deptCombo, {
xtype : 'tbfill'
}, {
text : 'Reset',
xtype : 'button',
id : 'reset',
handler : function() {
nameCombo.reset();
whseCombo.reset();
deptCombo.reset();
gridForm.form.reset();

ds.baseParams = {
userid : "",
sort : ""
};
ds.load({
params : {
start : 0,
limit : 50,
dummy : 'reset'
}
});
}
}, {
xtype : 'tbseparator'
}, {
text : 'Print',
iconCls : 'print',
handler : function() {
Ext.ux.Printer.print(grid);
}
}]
});

/*
* Here is where we create the Form
*/
// var gridForm = new Ext.FormPanel({
gridForm = Ext.extend(Ext.FormPanel, {
initComponent : function() {

var config = {

id : 'phone-system',
frame : true,
layout : 'form',
labelAlign : 'left',
iconCls : 'icon-grid',
title : 'H. Betti Industries - Corporate Directory',
bodyStyle : 'padding:5px',
//width : 975,
autoScroll : true,
layoutConfig : {
align : 'stretch'
},
layout : 'column', // Specifies that the items will now
// be arranged in
// columns

items : [{
columnWidth : 0.68,
layout : 'fit',
items : [grid]
}, {
columnWidth : 0.32,
xtype : 'fieldset',
labelWidth : 80,
labelAlign : 'right',
// title: 'User Details',
defaults : {
width : 180,
labelAlign : 'right'
},
defaultType : 'textfield',
autoHeight : true,
bodyStyle : Ext.isIE ? 'padding:0 0 5px 15px;' : 'padding:10px 15px;',
border : false,
style : {
"margin-left" : "10px", // when
// you
// add
// custom
// margin
// in
// IE 6...
"margin-right" : Ext.isIE6 ? (Ext.isStrict ? "-10px" : "-13px") : "0" // you
},
items : [{
fieldLabel : 'Full Name',
name : 'full_name'
}, {
fieldLabel : 'Last Name',
name : 'last_name'
}, {
fieldLabel : 'First Name',
name : 'first_name'
}, {
fieldLabel : 'Work Ext',
name : 'work_ext'
}, {
fieldLabel : 'Cell Phone',
name : 'cell_phone'
}, {
fieldLabel : 'Main Phone',
name : 'main_phone'
}, {
fieldLabel : 'Toll Free',
name : 'work_phone'
}, {
fieldLabel : 'Fax',
name : 'fax'
}, {
fieldLabel : 'Email',
name : 'email'
}, {
fieldLabel : 'Department',
name : 'dept'
}, {
fieldLabel : 'Title',
name : 'title'
}, {
fieldLabel : 'Location',
name : 'location'
}, {
fieldLabel : 'Office',
name : 'office'
}, {
fieldLabel : 'Address',
name : 'addr1'
}, {
name : 'addr2'
}, {
name : 'addr3'
}]
}]
// renderTo : bd

};
Ext.apply(this, config);
Ext.apply(this.initialConfig, config);
gridForm.superclass.initComponent.apply(this, arguments);
//gridForm.superclass.initComponent.call(this);
}
});