我有一个窗口,其中有如下图所示的项目。我想在字段之间留出间隙
代码:
new Ext.Window({
title : bundle.getMsg('add.camera'),
id:'win-add-camera',
closable:true,
autoHeight:true,
modal:true,
defaults : {
labelWidth: 60,
labelAlign: 'left',
margin: '0 0 20 0'
},
items: [{
xtype:'form',
layoutConfig: {
trackLabels: true
},
id: 'form-camera',
autoHeight:true,
autoScroll:true,
items:[
{
layout:'column',
items:[
{
columnWidth: .50,
bodyPadding:30,
margin: '0 0 20 0',
layout: 'form',
defaults:{anchor:'80%'},
items: [ {
id:'cam-name-id',
fieldLabel : bundle.getMsg('camera.name'),
name : 'cameraName',
margin: '0 0 20 0',
xtype:'textfield',
width:450,
emptyText : bundle.getMsg('enter.camName'),
maxLength:10,
enforceMaxLength:true
,required:true,
},
{
id:'url-id',
fieldLabel : bundle.getMsg('url'),
name : 'cameraWebUrl',
xtype:'textfield',
width:450,
margin: '0 0 20 0',
emptyText : bundle.getMsg('enter.url')
,
maxLength:10,enforceMaxLength:true,required:true,
},
{
id:'place-id',
fieldLabel : bundle.getMsg('place.name'),
maxLength:35,
name : 'cameraPlaceName',
xtype:'textfield',
width:450,
emptyText : bundle.getMsg('enter.place'),required:true
},
{
id:'latitude-id',
fieldLabel :bundle.getMsg('lattitude'),
name : 'cameraLatitude',xtype:'textfield',
width:450,emptyText :bundle.getMsg('enter.lattitude'), growMax: 500,required:true
},
{
id:'longitude-id',
fieldLabel : bundle.getMsg('longitude'),
name : 'cameraLongitude',xtype:'textfield',
width:450,emptyText : bundle.getMsg('enter.long'),required:true
},
{
xtype:'combo',
id: 'camera-combo-id',
name:'cameraStatus',
store : new Ext.data.ArrayStore({
data:[["Enable","1"],["Disable","2"]],
fields : ['cameraStatus','no']
}),
fieldLabel : bundle.getMsg('camera.status'),
displayField :'cameraStatus',
emptyText : bundle.getMsg('advice.select'),
valueField : 'no',
selectOnFocus:true,
allowBlank: false,
autoSelect:false,
mode:'local',
listeners:{
'select': function(){
camera_status_combo_value=Ext.getCmp('camera-combo-id').getValue();
camera_status_combo_value_name = Ext.getCmp('camera-combo-id').getRawValue();
alert(camera_status_combo_value)
alert(camera_status_combo_value_name)
},
'afterrender':function(){
this.getStore().load();
}
}
},
{
xtype : 'combo',
id: 'police-station-name-id',
name:'policeStationName',
width:450,
store : police_station_store,
fieldLabel : bundle.getMsg('policestation'),required:true,
displayField :'policeStationName',
emptyText : bundle.getMsg('selectpolicestation'),
valueField : 'gid',
triggerAction:"all",
selectOnFocus:true,
forceSelection: true,
queryMode : 'local',
listeners:{
'select': function(){
police_stn_id=Ext.getCmp('police-station-name-id').getValue();
police_station_combo=Ext.getCmp('police-station-name-id').getValue();
},
'afterrender':function(){
this.getStore().load();
}
}
},
最佳答案
我找到了解决方案 我在字段之间写了下面的行
{
xtype: 'tbspacer',
height:10
},
我们也可以添加代替上面的代码
{
height:10
}
两者都可以工作!
添加此代码之前:
添加代码后:
关于extjs - 如何增加 EXTJS 中字段之间的空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30069803/