Javascript ExtJS-带有存储的组合框添加自定义选择

是否有一种方法可以在不更改EXT store（本例中为myStore.carTypes）的情况下添加一个只显示“无”的选项？自定义值为“”

---

以下是我基于阅读你的问题而做出的假设： 您不希望商店中有条目（“无”），但仍希望组合框中有该条目。 您需要一个名为None且值为“”的条目，但由于displayField和valueField相同，因此存在问题

我有办法解决这个问题。首先在combobox中创建一个条目为“None”的新存储，并使用一个侦听器在查询之前更改存储数据。在本例中，确保combobox valueField和displayField不同（缩写，名称）。在beforequery侦听器中，我们修改与组合框关联的存储，并从本例中的另一个存储（states1）复制数据。在复制时，我们将states1存储中的名称作为name和abbr复制到新存储中。这应该可以解决您的问题。请查看下面的代码，或者在此时查看它的实际操作。如果您正在运行小提琴，请确保选择的主题是经典主题

Ext.application({
name: 'Fiddle',

launch: function () {
    var states1 = Ext.create('Ext.data.Store', {
        fields: ['abbr', 'name'],
        data: [{
            "abbr": "Alabama",
            "name": "Alabama"
        }, {
            "abbr": "Alaska",
            "name": "Alaska"
        }, {
            "abbr": "Arizona",
            "name": "Arizona"
        }]
    });

    Ext.create('Ext.form.ComboBox', {
        fieldLabel: 'Choose State',
        store: Ext.create('Ext.data.Store', {
            data: [{
                name: 'None',
                abbr: ''
            }, ]
        }),
        queryMode: 'local',
        displayField: 'name',
        valueField: 'abbr',
        editable: false,
        renderTo: Ext.getBody(),
        listeners: {
            beforequery: function (queryEvent, opts) {
                states1.each(function (record) { //replace states1 with your store var
                    queryEvent.combo.store.add({
                        name: record.data.name,
                        abbr: record.data.name
                    });
                });
            }
        }
    });
  }
});

---

如果这对您有帮助，请将其标记为答案，以便将来能够帮助他人。或者评论我的答案有什么问题。

Ext.application({
name: 'Fiddle',

launch: function () {
    var states1 = Ext.create('Ext.data.Store', {
        fields: ['abbr', 'name'],
        data: [{
            "abbr": "Alabama",
            "name": "Alabama"
        }, {
            "abbr": "Alaska",
            "name": "Alaska"
        }, {
            "abbr": "Arizona",
            "name": "Arizona"
        }]
    });

    Ext.create('Ext.form.ComboBox', {
        fieldLabel: 'Choose State',
        store: Ext.create('Ext.data.Store', {
            data: [{
                name: 'None',
                abbr: ''
            }, ]
        }),
        queryMode: 'local',
        displayField: 'name',
        valueField: 'abbr',
        editable: false,
        renderTo: Ext.getBody(),
        listeners: {
            beforequery: function (queryEvent, opts) {
                states1.each(function (record) { //replace states1 with your store var
                    queryEvent.combo.store.add({
                        name: record.data.name,
                        abbr: record.data.name
                    });
                });
            }
        }
    });
  }
});