Search code examples
arrayscomboboxextjs4store

Create store data from array and bindStore in Combobox Extjs 4

I have a problem with populating a combobox dynamically with ArrayStore.

In Controller: I have a StatusArray : ["Active", "Inactive", "Closed"] and i created a store like below

var test = Ext.create('Ext.data.ArrayStore', {
            fields: [
                { name: "Status" }
            ],
            data: StatusArray
        });

and then i populate the combobox with this store 

Ext.ComponentQuery.query('#statusId')[0].bindStore(test);

It works but the combobox gets only the first letter of every value in StatusArray like "A","I","C".

my form View with the combobox:

items: [{
        xtype: 'form', itemId: 'eventForm', bodyPadding: 10, anchor: '100%',
        items: [{ xtype: 'combobox', anchor: '100%', displayField: 'Status', name: 'Status', valueField: 'Status', typeAhead: true, queryMode: 'local', triggerAction: 'all', fieldLabel: ' Status ', emptyText: 'Select Status', tooltip: 'Select Status', selectOnFocus: true, itemId: 'statusId' },
            { xtype: 'button', itemId: 'submitButton', text: 'Submit' }
        ]
    }],

Can anyone help me with that? Thank you!!!

Solution

  • data object(statusarray) should be in the form of Array of Model instances or data objects to load locally...

    Use

    StatusArray : [["Active"], ["Inactive"], ["Closed"]]

    or

    StatusArray : [{"Active"}, {"Inactive"}, {"Closed"}]

    You can check example code of ArrayStore here