ExtJs4 Grid表格宽度自适应
var gridForm = Ext.create('Ext.form.Panel', {
id: 'company-form',
frame: true,
title: 'Company data',
bodyPadding: 5,
width: '100%',
layout: 'column', // Specifies that the items will now be arranged in columns
fieldDefaults: {
labelAlign: 'left',
msgTarget: 'side'
},
items: [{
columnWidth: 0.60,
xtype: 'gridpanel',
//store: ds,
height: 600,
forceFit: true, //列表宽度自适应 title:'客户信息表',
columns: [{
text: 'id',
dataIndex: 'id',
hidden: true
},{
text: '认筹编号',
dataIndex: 'company'
},
{
text : '姓名',
dataIndex: 'price'
},
{
text : '电话号码',
dataIndex: 'change'
},
{
text : '证件号',
dataIndex: 'pctChange'
},
{
text : '签到状态',
dataIndex: 'lastChange'
}]
}, {
columnWidth: 0.4,
margin: '0 0 0 10',
xtype: 'fieldset',
title:'Company details',
defaults: {
width: 240,
labelWidth: 90
},
defaultType: 'textfield',
items: [{
fieldLabel: 'Name',
name: 'company'
},{
fieldLabel: 'Price',
name: 'price'
},{
fieldLabel: '% Change',
name: 'pctChange'
},{
xtype: 'datefield',
fieldLabel: 'Last Updated',
name: 'lastChange'
}, {
xtype: 'radiogroup',
fieldLabel: 'Rating',
columns: 3,
defaults: {
name: 'rating' //Each radio has the same name so the browser will make sure only one is checked at once
},
items: [{
inputValue: '0',
boxLabel: 'A'
}, {
inputValue: '1',
boxLabel: 'B'
}, {
inputValue: '2',
boxLabel: 'C'
}]
}]
}]
});
/**
* 左部
*
*/
var product_left = Ext.create('Ext.panel.Panel', {
region: 'west',
width: 300,
collapsible: true,
split: true
});
var product_center = Ext.create('Ext.panel.Panel', {
region: 'center',
width: '100%',
items: [gridForm]
});
/**
* EXT渲染
*
*/
Ext.onReady(function () {
Ext.create('Ext.container.Viewport', {
layout: 'border',