Hello,
I've looked through many posts and was unable to solve my problem. I am hoping someone might have come across this issue and might be able to point me in the right direction. I am trying to populate the list with the associated data from the store - rather than the first level.
I am loading a store from a JSON file (sencha sample). Users - has Many Orders and Order items.
I have list that can populate the users - without any problems.
However, I would like to populate the list with Orders (the second level). I tried using TPL to access the orders but I am only getting blanks.
Thanks in advance
Here are the files I'm using: Model, Store, List and JSON
User.js model
Code:
Ext.define('MyApp.model.User', {
extend: 'Ext.data.Model',
config: {
fields: [
{name: 'id', type: 'int'},
{name: 'name', type: 'string'},
],
hasMany: {
model: 'MyApp.model.Order',
name: 'orders'
},
proxy: {
type: 'ajax',
url : 'userData.json',
}
} // config
});
User Store
Code:
Ext.define('MyApp.store.Users', {
extend: 'Ext.data.Store',
alias: 'store.userstore',
config: {
storeId: 'mystore',
model: 'MyApp.model.User',
autoLoad: true,
listeners:{
load: function(item, record){
console.log("User Store");
console.log(record);
} //load method
} // listener
} // config
});
List1Page.js
Code:
Ext.define ('MyApp.view.List1page', {
extend: 'Ext.dataview.List',
xtype: 'list1page',
requires: ['MyApp.store.Users'],
config:{
allowDelsect: false,
itemTpl: '<tpl for"orders">{id}</tpl>',
store: {
type: 'userstore'
}
}
});
Code:
//userData.json
[
{
"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"
}
]
}
]
},
{
"id": 2,
"name": "Jamie Avins",
"orders": [
{
"id": 200,
"status": "shipped",
"orderItems": [
{
"id": 456,
"price": 19.50,
"quantity": 2,
"name": "A Product"
}
]
}
]
},
{
"id": 3,
"name": "Aaron Conran",
"orders": [
{
"id": 300,
"status": "back order",
"orderItems": [
{
"id": 743,
"price": 19.50,
"quantity": 2,
"name": "The Product"
}
]
}
]
},
{
"id": 4,
"name": "Robert Dougan",
"orders": [
{
"id": 400,
"status": "shipped",
"orderItems": [
{
"id": 666,
"price": 19.50,
"quantity": 1,
"name": "No Product"
}
]
}
]
}
]
Here are the other models
Code:
Ext.define('MyApp.model.Order', {
extend: 'Ext.data.Model',
config: {
fields: [
{name: 'id', type: 'int'},
{name: 'status', type: 'string'},
],
hasMany: {
model: 'MyApp.model.OrderItems',
name: 'orderItems'
}
} // config
});
Code:
Ext.define('MyApp.model.OrderItem', {
extend: 'Ext.data.Model',
config: {
fields: [
{name: 'id', type: 'int'},
{name: 'price', type: 'float'},
{name: 'quantity', type: 'int'},
{name: 'name', type: 'string'},
]
} // config
});