Question

我有一个简单的组合框如下：

                    {
                    xtype: 'combobox',
                    id: 'prd-main-group',
                    fieldLabel: 'ANA MAL GRUBU',
                    inputWidth: 320,
                    labelWidth: 160,
                    labelAlign: 'right',
                    margin: '15 0 0 0',
                    fieldStyle: 'height: 26px; text-align: right; font-size: 12pt; color:#505050',
                    store: articleMain,
                    valueField: 'WHG',
                    displayField: 'WHG_BEZ',
                    queryMode: 'remote',
                    autoSelect: false,
                    selectOnFocus: true,
                    hideTrigger: true,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    typeAhead: true,
                    minChars: 2,
                    listeners: {
                        select: function (combo, selection) {
                            articleBase.proxy.extraParams = {'maingroup': combo.getValue()};
                            Ext.getCmp('prd-base-group').setDisabled(false);
                            Ext.getCmp('prd-base-group').getStore().removeAll();
                            Ext.getCmp('prd-base-group').setValue(null);
                            Ext.getCmp('prd-sub-group').getStore().removeAll();
                            Ext.getCmp('prd-sub-group').setValue(null);
                            articleBase.load();
                        },
                        focus: function(combo) {
                            combo.setValue('');
                        }
                    }
                },

当我输入两个或多个字符时，组合框下拉列表会出现并显示值，但不会从下拉列表中自动定位所选记录。

正如您可以看到附加的屏幕截图，已完成的值但是下拉列表没有聚焦选定的记录！

enter image description here

我的问题是，当我们键入几个字符时，下拉列表应根据给定的字符自动更改。

Answer 1

没有Skirtle's Den我该怎么做：）

我们应该在autoLoad: true定义中设置store参数。之后，我们还应将queryMode设置为local。我知道它没有意义但是当我们设置autoLoad时，数据会在创建商店后立即加载！

                    {

                    xtype: 'combobox',
                    id: 'prd-main-group',
                    fieldLabel: 'ANA MAL GRUBU',
                    inputWidth: 320,
                    labelWidth: 160,
                    labelAlign: 'right',
                    margin: '15 0 0 0',
                    fieldStyle: 'height: 26px; text-align: right; font-size: 12pt; color:#505050',
                    store: articleMain,
                    valueField: 'WHG',
                    displayField: 'WHG_BEZ',
                    queryMode: 'local',
                    autoSelect: true,
                    forceSelection: true,
                    msgTarget: 'side',
                    triggerAction: 'all',
                    listeners: {
                        select: function (combo, selection) {
                            articleBase.proxy.extraParams = {'maingroup': combo.getValue()};
                            Ext.getCmp('prd-base-group').setDisabled(false);
                            Ext.getCmp('prd-base-group').getStore().removeAll();
                            Ext.getCmp('prd-base-group').setValue(null);
                            Ext.getCmp('prd-sub-group').getStore().removeAll();
                            Ext.getCmp('prd-sub-group').setValue(null);
                            articleBase.load();
                        },
                        focus: function(combo) {
                            combo.setValue('');
                        }
                    }
                }

以下是商店定义：

var articleMain = new Ext.data.JsonStore({
model: 'ArticleMainGroup',
autoLoad: true,
proxy: {
    type: 'ajax',
    url: '<?php echo base_url() ?>create/get_product_main_group',
    reader: {
        type: 'json',
        root: 'articleMainGroup',
        idProperty: 'ID'
    }
}
});

Answer 2

您应该尝试使用autoSelect: true。

Answer 3

ForceSelection="true" + TypeAhead="true"它应该有效

Combobox - 下拉列表中的自动位置

3 个答案: