在ExtJs中本地过滤comboxes远程存储

Question

我有一个ExtJs组合框.它的存储使用JSON加载(使用下面的MyStore类).我想将所有值加载到商店,然后使用在组合的文本字段中输入的文本过滤它们(最好使用typeAhead功能).

问题是我想在客户端进行过滤(默认情况下,combo的mode属性为'remote').每次输入内容时,我都不希望我的组合重新加载它的商店.我怎样才能做到这一点？

谢谢.

这是我的商店类:

MyStore = Ext.extend(Ext.data.JsonStore, {
    constructor: function(jsonUrl, storeId, id, description, isAutoLoad, cfg) {
        cfg = cfg || {};
        GenericStore.superclass.constructor.call(this, Ext.apply({
            storeId: storeId,
            root: 'result',
            url: jsonUrl,
            autoLoad: isAutoLoad,
            fields: [
                {
                    name: id
                },
                {
                    name: description
                }
            ]
        }, cfg));
    }    
});

和组合:

            xtype: 'combo',
            fieldLabel: 'The Combo',
            width: 150,
            store: myStoreData,
            valueField: 'id',
            displayField: 'name',
            minChars : 0,
            editable : false,
            itemId : 'my-combo'

Answer 1

要实现这一目标,您必须:

1. 使用"isAutoLoad"配置选项构造MyStore类为"true"
2. 在你的组合框配置中,将"mode"配置选项设置为"local"(参见下面的另一个配置下的内置组合配置代码)

这是我的简短例子:

构造myStoreData变量

var myStoreData = new MyStore({
    autoLoad: true, //so the store will load automatically
    ...any_other_config_option...
});

构建了组合配置

{
     xtype: 'combo',
     fieldLabel: 'The Combo',
     width: 150,
     store: myStoreData, 
    // myStoreData is already loaded before as it have 'autoLoad' config set to true 
    // and act as localstore to populate the combo box item 
    // when the combo "mode" config set to 'local'
     valueField: 'id',
     displayField: 'name',
     minChars : 0,
     editable : true, //before was editable : false,
     itemId : 'my-combo',
     mode: 'local', // by default this was mode: 'remote'
     typeAhead: true // by default this was typeAhead: false
}