UserData.json

[mcaple]

Hi,
I have a number of models that get populated from a json file much like the kitchensink nested data example but when I load the data in my app only the top level attributes are loaded. If however I take these same files and place them in the kitchensink then the data is loaded correctly.
Also I have taken the UserData.json file and corresponding model files from the kitchensink app into my app and attempted to load the data. I see the array items but again only the top level is loaded so I see for example 'Ed Spencer', 'Jamie Avins' ... but not the details of orders. Could somebody explain what I am missing in my app. I know there will be a request for a sample but as I say I am taking the files from kitchensink. Do I need to add something to the app.json file for example?

{
        "id": 1,
        "name": "Ed Spencer",
        "orders": [
            {
                "id": 100,
                "status": "shipped",
                "orderItems": [
                    {
                        "id": 453,
                        "price": 19.50,
                        "quantity": 3,
                        "name": "Some Product"
                    }
                ]
            },
            {
                "id": 101,
                "status": "pending",
                "orderItems": [
                    {
                        "id": 543,
                        "price": 54.99,
                        "quantity": 1,
                        "name": "Some Product"
                    },
                    {
                        "id": 544,
                        "price": 20,
                        "quantity": 2,
                        "name": "Another Product"
                    }
                ]
            }
        ]
    },
...
...

just to say at first we were using

Ext.define(
....
       requires:  ['myModel',...];
....
);

and declared 'myModel' in app.js and then changed this to

Ext.require('myModel', function(){
   Ext.define(...)
};

which is the same as kitchensink and removed the 'myModel' from app.js.

Do not understand why kitchensink does things this way?

[mitchellsimoens]

In the tree store, have you tried setting the defaultRootProperty?

[mcaple]

Thanks mitchell but this thing has turned out to be truely bizarre. If you use the JSON data file segmentData.json as follows:

[
{
"id": 1,
"name": "young single or couplex",

"scaleItems": [
{
"id" : 100,
"scale": "S",
"status": "shipped"
},
{
"id" : 200,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 11,
"name": "older and wiser",

"scaleItems": [
{
"id" : 2100,
"scale": "S",
"status": "shipped"
},
{
"id" : 2200,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 2,
"name": "xxxxxxxxxxxxxxxxxxxxxx",

"scaleItems": [
{
"id" : 300,
"scale": "S",
"status": "shipped"
},
{
"id" : 400,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 3,
"name": "young single or couple",

"scaleItems": [
{
"id" : 700,
"scale": "S",
"status": "shipped"
},
{
"id" : 800,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 4,
"name": "older and wiser",

"scaleItems": [
{
"id" : 900,
"scale": "X",
"status": "shipped"
},
{
"id" : 1000,
"scale": "Y",
"status": "shipped"
}
]

},
{
"id": 5,
"name": "young single or couple",

"scaleItems": [
{
"id" : 1100,
"scale": "S",
"status": "shipped"
},
{
"id" : 1200,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 6,
"name": "young single or couple",

"scaleItems": [
{
"id" : 1200,
"scale": "S",
"status": "shipped"
},
{
"id" : 1300,
"scale": "C",
"status": "shipped"
}
]

},
{
"id": 7,
"name": "young single or couple",

"scaleItems": [
{
"id" : 1500,
"scale": "S",
"status": "shipped"
},
{
"id" : 1600,
"scale": "C",
"status": "shipped"
}
]

}
]

along with the model's

Ext.define('MyApp.model.Segment', {
extend: 'Ext.data.Model',
config: {
fields: ['id', 'name'],
hasMany: {
model: 'MyApp.model.ScaleItem',
name: 'scaleItems'
},
proxy: {
type: 'ajax',
url : 'segmentData.json'
}
}
});

and

Ext.define('MyApp.model.ScaleItem', {
extend: 'Ext.data.Model',
config: {
fields: ['id', 'scale', 'status']
}
});

and in your code do something like

{
xtype: 'dataview',
id: 'NestedLoadingDataView',
emptyText: 'No Data Loaded',
hidden: false,
styleHtmlContent: true,
itemTpl: [
'<div>{name}</div>'
].join(''),
store: new Ext.data.Store({
model: 'MyApp.model.Segment',
autoLoad: false
})

.....

this.store = Ext.getCmp('NestedLoadingDataView').getStore().load();
console.log('store=');
console.log(this.store);


What you will see is that

Ext.apply.create.Class._data.all[0].data

looks fine but

Ext.apply.create.Class._data.all[1].data

does not show ScaleItems. If you then change the "older and wiser" in id: 11 to "young single or couplex" then the item is parsed correctly and you see the scaleItems. El bizarro!! Have tried changing this text to many things with the item still not being parsed correctly.