var colModel = new Ext.grid.ColumnModel({
columns: [ columns here...]
})
var grid = new Ext.Ext.grid.GridPanel({
store: store,
loadMask: true,
autoExpandColumn: 'itemDescription',
stripeRows: true,
colModel: colModel
})
var form = new Ext.FormPanel({
labelWidth: 150,
bodyStyle: 'padding:2px 5px;',
autoScroll: true,
items:[
new Ext.form.FieldSet({
layout: 'fit',
collapsible: true,
height:300,
items: [
grid
]
}
]
})
The grid does not change its width once the window gets resized... Any thoughts???
var colModel = new Ext.grid.ColumnModel({
columns: [ columns here...]
})
var grid = new Ext.Ext.grid.GridPanel({
store: store,
loadMask: true,
autoExpandColumn: 'itemDescription',
stripeRows: true,
colModel: colModel
})
var form = new Ext.FormPanel({
labelWidth: 150,
bodyStyle: 'padding:2px 5px;',
autoScroll: true,
items:[
new Ext.form.FieldSet({
layout: 'fit',
collapsible: true,
height:300,
items: [
grid
]
}
]
})
The grid does not change its width once the window gets resized... Any thoughts???
Share Improve this question asked Apr 19, 2012 at 6:07 AMemberAMember 3,0572 gold badges34 silver badges64 bronze badges 2-
2
It would help to know the entire container structure and not only that the
Grid
is placed inside aFieldSet
which again is inside aFormPanel
. Are you sure its not theFieldSet
which is not resizing? If you putanchor: '-0'
on theFieldSet
, does that help? – Chau Commented Apr 19, 2012 at 6:17 - you can write it as an answer and I will accept it – AMember Commented Apr 19, 2012 at 7:30
2 Answers
Reset to default 4Your Grid
will resize according to the FieldSet
due to layout: 'fit'
. Since the FormPanel
doesn't have a layout set, it automatically uses layout: 'form'
. The FieldSet
will act as a normal Form Field
and thus needs to be configured to resize it self. This can be done using the anchor
property of the FormLayout
:
var form = new Ext.FormPanel({
labelWidth: 150,
bodyStyle: 'padding:2px 5px;',
autoScroll: true,
items:[
new Ext.form.FieldSet({
layout: 'fit',
anchor: '-0',
collapsible: true,
height:300,
items: [
grid
]
}
]
});
This will tell the FieldSet
to always stay 0 pixels from the right edge of the FormPanel
.
try this.....
var colModel = new Ext.grid.ColumnModel({
columns: [ columns here...]
})
var grid = new Ext.Ext.grid.GridPanel({
store: store,
loadMask: true,
autoExpandColumn: 'itemDescription',
stripeRows: true,
colModel: colModel
})
var form = new Ext.FormPanel({
labelWidth: 150,
bodyStyle: 'padding:2px 5px;',
autoScroll: true,
items : {
xtype : 'fieldset',
title : 'Give proper Title',
defaults: {
anchor: '100%'
},
layout: 'anchor',
collapsible: true,
items: grid
}
});