Can not populate ComboBox with SimpleArrayStore

[shadow_m]

Hi! I am new in Ext Designer, so sorry if my question woll be stuped.
I am Using Ext4 and Ext Designer 1.2
I need to create a combo and attach it to SimpleArrayStore.
I make all steps from manual (http://cdn.sencha.io/ext-designer/ex...sers-guide.pdf) but still have 0 records in my combo.

Steps I made:
1) Create combo
2) create store with 1 field (MyField1)
3) Adds an array of arrays in the Store’s data attribute [["Search Engine"], ["Online Ad"], ["Facebook"]])
4) Select my store on sombo properties
5) Set value "MyField1" to displayedField and valueField
6) Set triggerAction attribute to “all” and ComboBox mode (queryMode) attribute to local

COMBO

Ext.define('MyApp.view.ui.MyComboBox', {
    extend: 'Ext.form.field.ComboBox',


    fieldLabel: 'Label',
    displayField: 'MyField1',
    queryMode: 'local',
    store: 'MyArrayStore',
    valueField: 'MyField1',


    initComponent: function() {
        var me = this;
        me.callParent(arguments);
    }
});

STORE

Ext.define('MyApp.store.MyArrayStore', {
    extend: 'Ext.data.Store',


    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            storeId: 'MyArrayStore',
            data: [
                [
                    'Search Engine'
                ],
                [
                    'Online Ad'
                ],
                [
                    'Facebook'
                ]
            ],
            proxy: {
                type: 'ajax',
                reader: {
                    type: 'array'
                }
            },
            fields: [
                {
                    name: 'MyField1'
                }
            ]
        }, cfg)]);
    }
});

[aconran]

This looks like its configured properly. Did you get this working?

[shadow_m]

Yes, I use

[{"Search Engine"}, {"Online Ad"}, {"Facebook"}]

instead of

[["Search Engine"], ["Online Ad"], ["Facebook"]]

[aconran]

Really??? That shouldn't work

[shadow_m]

Yes, I get worked combo only after this. By the way,there is no [[],[],[]] structure on Ext4 examples, only [{},{},{}]

[Linus76]

I followed also the manual step by step and I encounter the same issue but the shadow_m's solution doesn't work for me.

Any idea about what's wrong in my code ?

Ext.define('MyComboBoxUi', {
    extend: 'Ext.form.field.ComboBox',

    name: 'test',
    fieldLabel: 'Label',
    displayField: 'test',
    queryMode: 'local',
    store: 'MyArrayStore',
    valueField: 'test',
    anchor: '100%',

    initComponent: function() {
        var me = this;
        me.callParent(arguments);
    }
});

Ext.define('MyArrayStoreUi', {
    extend: 'Ext.data.Store',

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            autoLoad: true,
            storeId: 'MyArrayStore',
            data: [
                'Hello',
                'Hi',
                'GoodMorning'
            ],
            proxy: {
                type: 'ajax',
                reader: {
                    type: 'array'
                }
            },
            fields: [
                {
                    name: 'test'
                }
            ]
        }, cfg)]);
    }
});

[Linus76]

Found my problem. Data was not correctly formated :

  data: [{"test" : "Hello"},  {"test" : "Hi"},  {"test" : "GoodMorning"}],

[mitchind]

Thanks to forum users for finding this bug and helping me solve what the Ext Designer is doing wrong.

I couldn't figure out how I got it to work and then immediately stopped working after Export.

As other people have determined the Array Reader required both the fieldname and data value to be in JSON array format using {} brackets.

But that means you also have to place the field name definition above the data array. This is how I got mine to work... But remember to save a copy - as Export will overwrite.

Ext.define('Quest Timesheets.store.dbRoadConditions', {
    extend: 'Ext.data.Store',

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            autoLoad: true,
            filterOnLoad: false,
            sortOnLoad: false,
            storeId: 'dbRoadConditions',
            proxy: {
                type: 'ajax',
                reader: {
                    type: 'array'
                }
            },
            fields: [
                {
                    name: 'conditions'
                }
            ],
            data: [ {"conditions":"good"}, {"conditions":"bad"}, {"conditions":"ugly"} ]
        }, cfg)]);
    }
});

/*
 * Data Array has to be formatted with {} and field names
 * Data Array must also follow field name definition
 */