Combobox ExtJS-设置组合框宽度时出现问题
让我先说一句,我已经和ExtJS一起工作了一个半星期了,所以请原谅我的无礼 我正在选项卡面板中构建一个表单,我正在测试不同的方法,将两个组合框并排放置,而不是堆叠在一起。我的第一次尝试是使用字段集,但我放弃了使用带有列布局的容器 这让我找到了以下代码:Combobox ExtJS-设置组合框宽度时出现问题,combobox,extjs,Combobox,Extjs,让我先说一句,我已经和ExtJS一起工作了一个半星期了,所以请原谅我的无礼 我正在选项卡面板中构建一个表单,我正在测试不同的方法,将两个组合框并排放置,而不是堆叠在一起。我的第一次尝试是使用字段集,但我放弃了使用带有列布局的容器 这让我找到了以下代码: Ext.onReady( function() { var tabs = new Ext.TabPanel({ renderTo: 'myForm', activeTab: 0, autoHeight: true, header
Ext.onReady( function() {
var tabs = new Ext.TabPanel({
renderTo: 'myForm',
activeTab: 0,
autoHeight: true,
header: true,
title: "Test Title",
border: false,
defaults: {
height: 256,
tabCls: 'order-tab'
},
items: [
{
title: 'Tab 1',
contentEl: 'tab1',
}
]
});
// Account Dropdown
var accountField = new Ext.form.ComboBox({
fieldLabel: 'Account',
store: new Ext.data.ArrayStore({
id: 0,
fields: [
'accountId',
'displayText'
],
data: [[1, 'Account 1'], [2, 'Account 2']]
}),
displayField: 'displayText',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'Select an account',
selectOnFocus:true,
boxMaxWidth: 170
});
//Type dropdown
var accountTypeField = new Ext.form.ComboBox({
fieldLabel: 'Type',
store: new Ext.data.ArrayStore({
id: 1,
fields: [
'accountTypeId',
'displayText'
],
data: [[0, 'Type1'], [1, 'Type2']]
}),
displayField: 'displayText',
typeAhead: false,
editable: false,
mode: 'local',
triggerAction: 'all',
value: 'Type1',
selectOnFocus:true,
boxMaxWidth: 109
});
//Account info fieldset (account dropdown + type dropdown)
var accountInfo = new Ext.form.FieldSet({
defaults: {
anchor: '-20'
},
items :[
accountTypeField
]
});
//Account info (account dropdown + type dropdown)
var accountInfoGroup = new Ext.Container({
autoEl: 'div',
layout: 'column',
cls: 'account-info',
defaults: {
xtype: 'container',
autoEl: 'div',
columnWidth: 1,
anchor: '-20',
},
"items":[
{
"layout":"column",
"items":[
{
"columnWidth":0.6,
"layout":"form",
"labelWidth": 50,
"items":[
accountField
]
},
{
"columnWidth":0.4,
"layout":"form",
"labelWidth": 30,
"anchor":-20,
"items":[
accountTypeField
]
}
]
}
]
});
this.form= new Ext.FormPanel({
applyTo: 'tab1',
border:false,
defaults:{xtype:'textfield'},
items:[
accountInfoGroup,
]
});
});
这看起来是我想要的,所以我开始回去清理未使用的字段集代码
这让我想到了愚蠢的部分。当我去掉这一部分时:
//Account info fieldset (account dropdown + type dropdown)
var accountInfo = new Ext.form.FieldSet({
defaults: {
anchor: '-20'
},
items :[
accountTypeField
]
});
…accountTypeField上的maxBoxWidth声明突然被忽略,布局变得非常不稳定。需要明确的是,最初在字段集片段中有更多的代码,但我可以去掉所有代码,并让maxBoxWidth正常工作,直到我尝试去掉剩下的两部分defaults>anchor and items>accountTypeField
所以我的问题是,到底发生了什么?为什么删除该字段集会影响组合框的宽度,而它甚至没有被使用?这是一个配置问题吗
我被难住了,很沮丧,正在寻求帮助 您正在混合未使用的对象的属性。。。尝试删除所有锚属性。这些仅适用于将锚点布局用作容器的情况。我会删除您为小部件和布局设置的任何绝对高度和宽度。例如,在使用列布局时,不能混合使用列宽和列宽。最好尽可能地与处理列和表布局的宽度保持一致 另外:使用外部面板而不是容器
//Account info (account dropdown + type dropdown)
var accountInfoGroup = new Ext.Panel({
autoEl: 'div',