dma*_*man 11 forms layout extjs
我有一个有3列的FormPanel.每列占FormPanel宽度的33%.看起来像这样:
searchForm = new Ext.FormPanel({
frame: true,
title: 'Search Criteria',
labelAlign: 'left',
labelStyle: 'font-weight:bold;',
labelWidth: 85,
width: 900,
items: [{
layout: 'column',
items: [{ // column #1
columnWidth: .33,
layout: 'form',
items: [{
xtype: 'textfield',
fieldLabel: 'Banner ID',
name: 'bannerID',
anchor: '95%',
},
new Ext.form.ComboBox({
fieldLabel: 'Advertiser',
typeAhead: true,
triggerAction: 'all',
mode: 'local',
emptyText: 'Advertiser',
store: advertiserList,
valueField: 'id',
displayField: 'name'
})] // close items for first column
}, {
columnWidth: .33,
layout: 'form',
items: [{
xtype: 'textfield',
fieldLabel: 'Banner Name',
name: 'bannerName',
anchor: '95%',
},
new Ext.form.ComboBox({
fieldLabel: 'Art Type',
typeAhead: true,
triggerAction: 'all',
mode: 'local',
emptyText: 'Art Type',
store: artTypesList,
valueField: 'id',
displayField: 'name'
})] // close items for second column
}, {
columnWidth: .33,
layout: 'form',
items: [{
xtype: 'hidden'
},
new Ext.form.ComboBox({
fieldLabel: 'Art Size',
typeAhead: true,
triggerAction: 'all',
mode: 'local',
emptyText: 'Art Size',
store: artSizeList,
valueField: 'id',
displayField: 'name'
})] // close items for third column
}]
}]
}); // close searchForm FormPanel
Run Code Online (Sandbox Code Playgroud)
它显示的内容如下所示:
唯一的问题是我希望"艺术尺寸"字段/标签与"广告商"和"艺术类型"字段在同一行上对齐.有没有办法添加一个"空白"项目,这样它会强制输入到正确的行?还有另一种方法可以解决这个问题吗?
谢谢!
编辑:这工作:
{
xtype: 'component',
fieldLabel: ' ',
labelSeparator: ' ',
}
Run Code Online (Sandbox Code Playgroud)
默认情况下,隐藏空标签(该字段被推向左侧).而不是把' ' 标签 ...
fieldLabel: ' ',
labelSeparator: ' ',
Run Code Online (Sandbox Code Playgroud)
你可以正确地做到:
hideEmptyLabel : false
Run Code Online (Sandbox Code Playgroud)
即使没有指定标签,女巫也会对齐您提交的组件.
编辑:这工作:
{
xtype: 'component',
fieldLabel: ' ',
labelSeparator: ' ',
}
Run Code Online (Sandbox Code Playgroud)