Bil*_*ami 20 javascript user-interface combobox extjs extjs4
有没有办法将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
});
Run Code Online (Sandbox Code Playgroud)
Sim*_*all 36
这有两个部分.首先,您需要在组合框配置中设置matchFieldWidth:false.然后,您可以在listConfig部分中指定width属性以仅设置下拉列表的样式,同时在主配置中指定组合框本身的宽度.
这与以前的版本不同,只允许您指定listWidth属性.
小智 5
我没有找到动态更改'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;
}
}
}
}
Run Code Online (Sandbox Code Playgroud)
来源:http : //www.sencha.com/forum/showthread.php?293120-Setting-BoundList-minWidth-to-the-width-of-a-parent-ComboBox-without-matchFieldWidth