extJS acting strange (layout) - any ideas?

[trappy]

Hi all,

We've been getting some strange errors with extJS grids and forms. It seems there is something wrong with the auto-resize of extJS.

We are using extJS 2.2 with jQuery connector. Here are 2 of the issues. Each problem has an example screenshot at the end.

#1) Form Problem
Checkboxes are not clickable anymore. The only way to activate them is to click right to the checkbox field, where there is a field which spans just to the end of the container + another 1 or 2 px. The checkboxes don't even show up unless we use autoShow: true in the checkbox settings. Other than that they are fairly standard:

new Ext.form.Checkbox({
    fieldLabel:FO_LANGUAGE['security_nonssl'],
    name:'security_nonssl',
    checked: FO_ENV.form_record['security_nonssl'] == "0" ? true : false,
    'autoShow': true
}),

The formpanel containing the checkboxes is initialized with these values:

autoHeight:true,
autoWidth:true,
frame:true,
labelWidth: 200, // label settings here cascade unless overridden
width: 575,
bodyStyle:'padding:5px 5px 0'

Has anyone seen this problem before?

#2) Grid Problem

The GridPanel we use has major resizing problems. The columns are on autoWidth, but each row is "autoWidthed" separately. We have a min-width which seems to be used instead of autoWidth, but once we resize the columns to accomodate the widest value then everything snaps into place correctly.

[mjlecomte]

I'd post some code that reproduces your problem...