Results 1 to 8 of 8

Thread: Can not populate ComboBox with SimpleArrayStore

  1. #1
    Sencha User
    Join Date
    Jun 2010
    Posts
    18
    Vote Rating
    0
      0  

    Default Can not populate ComboBox with SimpleArrayStore

    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 Stores 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
    Code:
    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
    Code:
    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)]);
        }
    });

  2. #2
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    146
      0  

    Default

    This looks like its configured properly. Did you get this working?
    Aaron Conran
    @aconran

  3. #3
    Sencha User
    Join Date
    Jun 2010
    Posts
    18
    Vote Rating
    0
      0  

    Default

    Yes, I use
    Code:
    [{"Search Engine"}, {"Online Ad"}, {"Facebook"}]
    instead of
    Code:
    [["Search Engine"], ["Online Ad"], ["Facebook"]]

  4. #4
    Sencha User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    146
      0  

    Default

    Really??? That shouldn't work
    Aaron Conran
    @aconran

  5. #5
    Sencha User
    Join Date
    Jun 2010
    Posts
    18
    Vote Rating
    0
      0  

    Default

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

  6. #6
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    7
    Vote Rating
    0
      0  

    Default

    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 ?

    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);
        }
    });
    Code:
    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)]);
        }
    });

  7. #7
    Ext JS Premium Member
    Join Date
    Feb 2009
    Posts
    7
    Vote Rating
    0
      0  

    Default

    Found my problem. Data was not correctly formated :

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

  8. #8
    Sencha User
    Join Date
    Oct 2011
    Posts
    6
    Vote Rating
    0
      0  

    Default Array definition generated from Ext Designer doesn't work

    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.

    Code:
    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
     */

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •