View Full Version : IE problem - invalid argument exception after a call to doLayout

7 Dec 2009, 4:17 AM

I have a serious problem that only occurs in IE (I'm using IE8).
Ext version: 3.0.3 (also tested with ext 3.0)

in ext-all-debug.js line 5573 I get an exception: Invalid argument.
This is because width is NaN

The exception occurs when calling doLayout on a panel (which has some items). Calling doLayout(true/*shallow*/) does not trigger the exception. I mention that the panel was rendered ok when I created it and when an event occurs I want to add/show/hide some components, and after this I call doLayout()

Stack trace:

ext-all-debug.js line 5572 method setWidth
ext-all-debug.js line 16125 method setWidth
ext-all-debug.js line 56245 method doResize -> here w is undefined and lw is NaN
ext-all-debug.js line 56236 method onResize
ext-all-debug.js line 16616 method setSize
ext-all-debug.js line 16658 method setHeight -> here height has a good value (ex: for me, is called with height = 20)
ext-all-debug.js line 21163 method onLayout
ext-base-debug.js line 435 method each
ext-all-debug.js line 21246 method each
ext-all-debug.js line 18315 method layout
ext-all-debug.js line 18056 method doLayout
ext-all-debug.js line 18063 method doLayout
ext-all-debug.js line 18063 method doLayout
ext-all-debug.js line 18063 method doLayout
a_custom_component of mine extending Ext.Panel method doLayout()

Can anyone help? It's really anoying and I can't find a solution.


7 Dec 2009, 5:04 AM
This is a known issue. In most cases this is caused by an incorrectly configured layout, but in some instances Ext itself is at fault.

Can you post an example that demonstrates the issue?

21 Dec 2009, 10:15 AM
Hello Condor,

sorry for the very late reply.
After being very busy for about a week and another three days of debugging the issue (we had a very large code base), I succeded to isolate the problem.

I post the code below:

new Ext.Window({
title: 'hey',
renderTo: Ext.getBody(),
width: 500, height: 300,
layout: 'hbox',
items: [
new Ext.form.TextField({ flex: 1 }),
new Ext.form.ComboBox({
flex: 3, mode: 'local', triggerAction: 'all',
store: new Ext.data.ArrayStore({
fields: ['id','name'],
data: [[1,'radu'],[2,'mihai']]
valueField: 'id',
displayField: 'name'
The problem only occurs in IE.
Steps to reproduce the doLayout problem (invalid argument exception):

1. Select a value from the combo.
2. Try to resize the window.

As far as I have seen it's a best practice to put the text fields (combos, datepicker, etc) in containers, and put the containers in hbox|vbox layouts. Am I right? This solves the problem mentioned above.

Hope this post helps in doing ExtJS better.