有没有办法将ExtJS(版本4)的宽度设置为ComboBox的下拉菜单比实际输入框宽?
我有一个comboxbox,我希望大约200px,但我对结果下拉列表进行分页,并且该宽度甚至不足以显示所有分页栏的控件。
这是我创建组合的代码:
var add_combo = Ext.create('Ext.form.field.ComboBox',
{
id : 'gbl_add_combo',
store : Ext.create('Ext.data.Store',
{
remoteFilter : true,
fields : ['gb_id', 'title'],
proxy :
{
type : 'ajax',
url : 'index.php/store/get_items',
reader :
{
type : 'json',
root : 'records',
totalProperty : 'total',
successProperty : 'success'
},
actionMethods :
{
read : 'POST',
create : 'POST',
update : 'POST',
destroy : 'POST'
}
}
}),
listConfig:
{
loadingText: 'Searching...',
emptyText: 'No results found'
},
queryMode : 'remote',
hideLabel : true,
displayField : 'title',
valueField : 'gb_id',
typeAhead : true,
hideTrigger : true,
emptyText : 'Start typing...',
selectOnFocus : true,
width : 225,
minChars : 3,
cls : 'header_combo',
pageSize : 15
});
答案 0 :(得分:36)
这有两个部分。首先,您需要在组合框配置中设置matchFieldWidth:false。然后,您可以在listConfig部分指定宽度属性以仅设置下拉列表的样式,同时在主配置中指定组合框本身的宽度。
这与以前的版本不同,只允许您指定listWidth属性。
答案 1 :(得分:3)
我没有办法改变' matchFieldWidth'属性动态。所以我找到了另一个解决方案:
{
xtype: 'combobox',
fieldLabel: 'Short Options',
queryMode: 'local',
store: ['Yes', 'No', 'Maybe'],
matchFieldWidth: false,
listConfig: {
listeners: {
beforeshow: function(picker) {
picker.minWidth = picker.up('combobox').getSize().width;
}
}
}
}