ExtJS ComboBox下拉宽度比输入框宽度宽？ [英] ExtJS ComboBox dropdown width wider than input box width?

问题描述

有什么方法可以设置ExtJS（版本4）ComboBox的下拉菜单的宽度比实际输入框宽吗？

Is there any way to set the width of an ExtJS (version 4) ComboBox's dropdown menu to be wider than that of the actual input box?

我有一个comboxbox，我想在200px左右，但我有结果下拉菜单，该宽度甚至不够大，以显示所有的分页栏的控件。

I have a comboxbox that i want to be around 200px but I have paging on the results dropdown and that width is not even big enough to show all the paging bar's controls.

这是我创建组合的代码：

Here's my code to create the combo:

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
    });

推荐答案

首先，您需要设置 matchFieldWidth ：false在你的combobox配置。然后，您可以在 listConfig 部分只为下拉菜单设置样式，同时在主配置中指定组合框本身的宽度。

There are two parts to this. Firstly, you need to set matchFieldWidth: false in your combobox config. You can then specify width attributes in the listConfig section to style just the dropdown, while specifying the width of the combobox itself in the main config.

这与上一版本不同， listWidth属性。

This varies from the pervious version, which just let you specify the listWidth property.

这篇关于ExtJS ComboBox下拉宽度比输入框宽度宽？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！