1

我尝试将值动态添加到 ArrayStore,并在 ComboBox 中显示这些值。

我的商店看起来像:

'Selection' : Ext.create('Ext.data.ArrayStore', {
    storeId : 'selection-store',
    fields  : [
        { name : 'id', type : 'string' },
        { name : 'name', type : 'string' },
        { name : 'elements', type : 'array' },
        { name : 'properties', type : 'array' }
    ]
})

我使用以下代码将东西添加到商店:

var selection = {id : id, name : id, elements : elements, properties : []};
Stores.Selection.add(selection);
Stores.Selection.commitChanges();

我的 ComboBox 看起来像

xtype        : 'combo',
store        : Stores.Selection,
displayField : 'name',
valueField   : 'name',
emptyText    : 'Choose Selection...',
id           : 'selection-dropdown',
editable     : false

因此,现在当我将一些值添加到存储中,并查看存储(例如通过 FireBug)时,我添加的所有内容都在 items-Array 中,应该是这样。但是一旦我展开 ComboBox,商店就会被清空,然后是空的;ComboBox 也是空的。

但是,当我在向商店添加内容之前展开并关闭 ComboBox,然后开始添加内容时,它的行为就像它应该表现的那样(值被存储并且 ComboBox 显示值的名称)。

我正在使用 ExtJS 4.1,但我不知道这种奇怪的行为可能来自哪里。

4

1 回答 1

0

听起来您可能需要更改组合的queryMode属性,以防止它在组合打开时尝试重新创建商店。这似乎对我有用。

这段代码有一个小提琴:http: //jsfiddle.net/cfarmerga/KvUd2/

Ext.onReady(function() {    

    var selection = Ext.create('Ext.data.ArrayStore', {
        storeId : 'selection-store',
        fields  : [
            { name : 'id', type : 'string' },
            { name : 'name', type : 'string' },
            { name : 'elements', type : 'array' },
            { name : 'properties', type : 'array' }
        ]
    });

    selection.add({ id: 1, name: 1, 
                    elements: ['a', 'b'], properties: ['x', 'y']});
    selection.add({ id: 2, name: 2, 
                    elements: ['a', 'b'], properties: ['x', 'y']});
    selection.add({ id: 3, name: 3, 
                    elements: ['a', 'b'], properties: ['x', 'y']});
    selection.commitChanges();

    Ext.create('Ext.form.Panel', {
        renderTo: Ext.getBody(),
        border: false,
        margin: '10 10 10 10',
        items: [
            {
                xtype: 'combo',
                fieldLabel: 'Combo',
                name: 'combo',
                labelWidth: 50,
                width: 300,
                displayField: 'name',
                valueField: 'name',
                emptyText: 'Choose selection...',
                editable: false,
                store: selection,
                queryMode: 'local'
            }
        ]
    });

});
于 2013-07-16T20:16:14.577 回答