PDA

View Full Version : help! collapsible fieldset with column layout doesn't work in IE6!



safewolf
3 Jan 2011, 5:40 AM
hi ,everyone

i have a new problem now!

this is my code
in IE8,FF,chrome
it works

but in IE6, it doesn't work

you can see the screen shot from attachments



Ext.onReady(
function(){
panel = new Ext.FormPanel({items:[{
xtype : 'fieldset',
anchor : "99%",
collapsible : true,
collapsed : true,
style : 'margin:10px',
title : 'My Field',
items : [{
layout : "column",
border : false,
items : [{
border : false,
layout : 'form',
items : [{
xtype : "textfield",
fieldLabel : 'field 1',
name : 'field1',
anchor : "96%",
width : "120"
}],
columnWidth : 0.5
}, {
border : false,
layout : "form",
columnWidth : 0.5,
items : [{
xtype : "textfield",
fieldLabel : 'field 2',
name : 'field2',
anchor : "96%"
}]
}]
}, {
xtype : "textfield",
allowBlank : false,
disabled : true,
fieldLabel : 'field 3',
name : 'field3',
anchor : "96%"
}]
}]});
panel.render(Ext.getBody());
}
);

Condor
3 Jan 2011, 8:07 AM
The panel that is layout:'column' is missing an 'anchor' config option (which means the layout won't assign a width).

safewolf
3 Jan 2011, 5:58 PM
Sorry

it doesn't work

i think it's a bug of extjs

you can have a try of my code

if the fieldset is not collapsible, it will be displayed correctly

but if it's collapsible, the probelm comes

Condor
3 Jan 2011, 11:37 PM
I've made some small modifications, but it works on my IE6:

Ext.onReady(function () {
Ext.QuickTips.init();
new Ext.form.FormPanel({
width: 800,
items: [{
xtype: 'fieldset',
anchor: '0',
collapsible: true,
collapsed: true,
padding: 10,
title: 'My Field',
items: [{
xtype: 'container',
layout: 'column',
anchor: '0',
items: [{
xtype: 'container',
layout: 'form',
columnWidth: 0.5,
items: [{
xtype: 'textfield',
fieldLabel: 'field 1',
name: 'field1',
anchor: '-20'
}]
},
{
xtype: 'container',
layout: 'form',
columnWidth: 0.5,
items: [{
xtype: 'textfield',
fieldLabel: 'field 2',
name: 'field2',
anchor: '-20'
}]
}]
},
{
xtype: 'textfield',
allowBlank: false,
fieldLabel: 'field 3',
name: 'field3',
anchor: '-20'
}]
}],
renderTo: Ext.getBody()
});
});