javascript - 在 Ext JS 中过滤组合框

Question

我在我的应用程序中使用 ExtJS 的组合框构建了一个查询构建器。

当用户从组合框中选择一个字段进行搜索时，他可以选择添加最多两个组合框来缩小搜索范围。

我的组合框商店有六个项目 - 当用户选择这六个项目中的一个时，如果他添加另一个组合框，则该特定项目不应该可供选择。

我在想的是将组合框存储到一个变量中并以某种方式删除第一个值，然后将其加载到新添加的组合框中。

有什么简单的方法可以做到这一点吗？

干杯!

编辑

我做了这个插图是为了让问题更容易理解

Answer 1

Ext.require('*');

Ext.define('KeyValue', {
    extend: 'Ext.data.Model',
    fields: ['id', 'value']
})

Ext.onReady(function() {

    var options = [{
        id: 1,
        value: 'One'
    }, {
        id: 2,
        value: 'Two'
    }, {
        id: 3,
        value: 'Three'
    }, {
        id: 4,
        value: 'Four'
    }, {
        id: 5,
        value: 'Five'
    }, {
        id: 6,
        value: 'Six'
    }];

    var parent = new Ext.form.field.ComboBox({
        store: {
            model: KeyValue,
            data: options
        },
        forceSelection: true,
        editable: false,
        displayField: 'value',
        valueField: 'id',
        queryMode: 'local',
        listeners: {
            select: function(cmb, records) {
                var selected = records[0],
                    store = child.getStore(),
                    rec;

                rec = store.getById(selected.getId());
                store.remove(rec);
            }
        }
    });

    var child = new Ext.form.field.ComboBox({
        store: {
            model: KeyValue,
            data: options
        },
        forceSelection: true,
        editable: false,
        displayField: 'value',
        valueField: 'id',
        queryMode: 'local'
    });

    new Ext.form.Panel({
        width: 400,
        renderTo: document.body,
        items: [parent, child]
    });

});