我们爱分享----Ext经验谈(一)
由于最近项目抓紧时间结项,所以时间不是很多,每次只能讲解1~2个经验了
废话不多说先看图:
这张图是有问题的,大家可以看见很明显填报时间显示的日期空间不够,我想要的效果是:
填报时间显示的日期空间够用了 而且还很紧凑
但是我调控出来的效果如下图:
好了下面开始上代码
/**
* Ext JS Library 2.0 Extend
* Crim Widget Libraries
*
* http://sourceforge.net/projects/Crim
*/
Ext.namespace('Crim.enterprisedatacollect.jinengjianpai');
/**
* 新增用户表单
* @class Crim.security.user.AddUserFormPanel
* @extends Ext.FormPanel
* @constructor
*
* @param {Object} config The configuration options
*/
Crim.enterprisedatacollect.jinengjianpai.AddFormPanel = function(config){
// 初始化表单
Crim.enterprisedatacollect.jinengjianpai.AddFormPanel.superclass.constructor.call(this, Ext.applyIf(config, {
labelAlign: 'left',
buttonAlign: 'right',
labelWidth: 90,
baseCls: 'x-plain',
layout: 'form',
items: [{
xtype: 'fieldset',
title: '2011年第一季度',
autoHeight: true,
bodyStyle: 'padding:0 0 0 60;',
layout: 'column',
defaults: {
layout: 'column',
baseCls: 'x-plain'
},
items: [{
defaults: {
layout: 'form',
baseCls: 'x-plain'
},
items: [{
columnWidth: 1,
defaultType: "textfield",
defaults: {
anchor: "50%",
labelStyle: 'width:200;'
},
items: [{
fieldLabel: '本季职工工资总额(万元)'
},{
fieldLabel: '本季职工平均人数(人)'
},{
fieldLabel: '本季职工增加人数(人)'
},{
fieldLabel: '本季末职工人数(人)'
},{
fieldLabel: '本季从业人员劳动报酬(万元)'
},{
fieldLabel: '本季从业人员平均人数(人)'
},{
fieldLabel: '本季末从业人员人数(人)'
},{
fieldLabel: '本季职工减少人数(不含自然减员)'
}]
}]
},{
defaults: {
layout: 'form',
baseCls: 'x-plain'
},
items: [{
columnWidth: 0.5,
items: [{
xtype: 'label',
fieldLabel: '填报时间',
labelStyle: 'width:80;',
value:'2011-06-10',
anchor: '70%'
}]
}, {
columnWidth: 0.5,
items: [{
xtype: 'textfield',
fieldLabel: '填报人',
labelStyle: 'width:60;',
anchor: '60%'
}]
}]
}]
}]
}));
}
Ext.extend(Crim.enterprisedatacollect.jinengjianpai.AddFormPanel, Ext.FormPanel, {});