Associated hasMany Model with Complex JSON model

[romanyu]

I need to read a complex JSON file showed below:

{
    "stores": [
        {
            "name": "pizzahut - hk",
            "shopId": "110",
            "detail": {
                "logo": "resources/img/PizzaHut.png",
                "phone": "+123 1234 1234",
                "website": "www.pizzahut.com.hk",
                "working time": {
                    "Mon": "rest",
                    "Tue": "1030 am ~ 12 pm",
                    "Wed": "1030 am ~ 12 pm",
                    "Thur": "1030 am ~ 12 pm",
                    "Fri": "1030 am ~ 12 pm",
                    "Sat": "1030 am ~ 12 pm",
                    "Sun": "1030 am ~ 12 pm"
                }
            }
        },
        {
            "name": "必勝客 - China",
            "shopId": "120-5",
            "detail": {
                "logo": "resources/images/shop/shopDetail/PizzaHut.png",
                "phone": "+123 1234 1234",
                "website": "www.pizzahut.com.cn",
                "working time": {
                    "Mon": "1030 am ~ 12 pm",
                    "Tue": "rest",
                    "Wed": "1030 am ~ 12 pm",
                    "Thur": "1030 am ~ 12 pm",
                    "Fri": "1030 am ~ 12 pm",
                    "Sat": "1030 am ~ 12 pm",
                    "Sun": "1030 am ~ 12 pm"
                }
            }
        },
        ...
        ]
}

ShopStore.js:

Ext.define('PizzaHut.store.ShopStore', {
    extend: 'Ext.data.Store',
    
    config: {
        model: 'PizzaHut.model.ShopModel',
        sorters: 'name',
        autoLoad: true,
        
        proxy: {
            type: 'ajax',
            url: 'PizzaHut_list.json',
            reader: {
                type: 'json',
                rootProperty: 'stores'
            }
        }
    }
});

So it would be 3 model to represent this data structure.
ShopModel.js:

Ext.define('PizzaHut.model.ShopModel', {
    extend: 'Ext.data.Model',
    
    config: {
        fields: ['name', 'shopId'],
        hasMany: {
            model: "PizzaHut.model.ShopDetailModel",
            name: 'detail',
            associationKey: 'detail'
        }
    }
    
});

ShopDetailModel.js:

Ext.define('PizzaHut.model.ShopDetailModel', {
    extend: 'Ext.data.Model',
    
    config: {
        fields: ['logo', 'phone', 'website'],
        hasMany: {
            model: "PizzaHut.model.ShopDetailTimeModel",
            name: 'working time',
            associationKey: 'working time',
        }
    }
    
});

ShopDetailTimeModel.js:

Ext.define('PizzaHut.model.ShopDetailTimeModel', {
    extend: 'Ext.data.Model',
    
    config: {
        fields: ['Mon', 'Tue', 'Wed', 'Thur', 'Fri', 'Sat', 'Sun']
    }
    
});

I can get the second detail information by using list itemtap function and record.detail().each(function (item, index, length) { var shopname = record.get('name'); var workingtime = item.get('working time'); }) function, but when to obtain the working time information, something is wrong.

I print the workingtime object on the console (console.log(workingtime)):

[                                                        ]
Object
Fri: "1030 am ~ 12 pm"
Mon: "1030 am ~ 12 pm"
Sat: "1030 am ~ 12 pm"
Sun: "rest"
Thur: "1030 am ~ 12 pm"
Tue: "1030 am ~ 12 pm"
Wed: "1030 am ~ 12 pm"
id: "ext-record-31"
shopdetailmodel_id: "ext-record-30"
__proto__: Object

I have tired workingtime.get('Mon'), workingtime.getCount() and many other ways but still cannot get the nested information. Anyone has some suggestion? Many thanks in advance!

[mitchellsimoens]

With your store and models and using ST 2.1.0 final this test case works for me:

new PizzaHut.store.ShopStore({
    listeners : {
        load : function(store, recs) {
            var rec         = recs[0],
                details     = rec.detail(),
                detail      = details.getAt(0),
                workingTime = detail['working time']();

            console.log(workingTime.getCount()); // <-- returns 1 as expected
        }
    }
});