1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    2
    Vote Rating
    0
    waelhamdan is on a distinguished road

      0  

    Default Unanswered: Populating Combobox from a json

    Unanswered: Populating Combobox from a json


    Hello,

    How would I populate the categories' name in this json file into a combobox?


    Code:
    {
    "data" : [
                {
                    "shop": "A",
                                    "total":18472,
                    "categories": 
                    [
                        {
                            "name" : "accessories",
                            "quantity" : 17000
                            
                        },
                        { 
                            "name" : "hardware",
                            "quantity" : 24000
                            
                        },
                        { 
                            "name" : "covers",
                            "quantity" : 32000
                            
                        },
                        { 
                            "name" : "bags",
                            "quantity" : 43000
                            
                        }
                    ]
                
                }
           
            ]
    }
    so the combobox will look like:
    -accessories
    -hardware
    -covers
    -bags

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,866
    Answers
    652
    Vote Rating
    438
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You can specify the root as 'categories'

    Scott.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    2
    Vote Rating
    0
    waelhamdan is on a distinguished road

      0  

    Default


    When setting categories as root I'm getting an error when trying to load the store (right click on store and "load data" using Architect 2): "Unable to load data using the supplied configuration."
    Changing it back to data will load the store just fine.

    Here's my store
    Code:
    Ext.define('MyApp.store.MyJsonStore', {
        extend: 'Ext.data.Store',
    
    
        requires: [
            'MyApp.model.categories'
        ],
    
    
        constructor: function(cfg) {
            var me = this;
            cfg = cfg || {};
            me.callParent([Ext.apply({
                autoLoad: true,
                storeId: 'MyJsonStore',
                model: 'MyApp.model.categories',
                proxy: {
                    type: 'ajax',
                    url: 'data/sales.json',
                    reader: {
                        type: 'json',
                        root: 'categories'
                    }
                },
                fields: [
                    {
                        name: 'name'
                    },
                    {
                        name: 'quantity'
                    }
                ]
            }, cfg)]);
        }
    });
    and the model

    Code:
    Ext.define('MyApp.model.categories', {
        extend: 'Ext.data.Model',
    
    
        fields: [
            {
                name: 'name'
            },
            {
                name: 'quantity'
            }
        ]
    });
    am I missing any thing?

  4. #4
    Sencha - Community Support Team
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    346
    Vote Rating
    113
    vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all vietits is a name known to all

      0  

    Default


    With your given data, you should config root for proxy reader set to "data[0].categories".
    Code:
    Ext.define('MyApp.store.MyJsonStore', {
        extend: 'Ext.data.Store',
    
    
        requires: [
            'MyApp.model.categories'
        ],
    
    
        constructor: function(cfg) {
            var me = this;
            cfg = cfg || {};
            me.callParent([Ext.apply({
                autoLoad: true,
                storeId: 'MyJsonStore',
                model: 'MyApp.model.categories',
                proxy: {
                    type: 'ajax',
                    url: 'data/sales.json',
                    reader: {
                        type: 'json',
                        root: 'data[0].categories'
                    }
                },
                fields: [
                    {
                        name: 'name'
                    },
                    {
                        name: 'quantity'
                    }
                ]
            }, cfg)]);
        }
    });

Thread Participants: 2

Tags for this Thread