Using ExtJS4 Store, I want to execute a Javascript function to return json data, ie. getMyJsonData, to load the data into the store.
function getMyJsonData() {
var myjson = {... };
return myjson;
}
Trawling through the doco, I can't find a way to define a callback function to load the data, all I found was a Memory Store which loads an already defined data object.
How can I call a function instead ?
Ext.define('perhoo.store.Users',
{
extend: 'Ext.data.Store',
model: 'perhoo.model.User',
autoLoad: true,
data : {
users: [
{ id: 1, name: 'joe44', email: 'joe@joe.com'},
{ id: 2, name: 'bloggs44', email: 'bloggs@joe.com'}
]
},
proxy: {
type: 'memory',
data: this.data,
reader: {
type : 'json',
root : 'users'
}
}
EDIT
The reason I want to call a function is because I want to execute LinkedIn API. And going through Ext JSONP Proxy (as it's cross domain) makes things 10x more complicated as I have to get LinkedIn auth etc etc (which I don't know how to do it yet)
ie var mydata = null;
function onLinkedInAuth() {
// Linked in api to find connections
IN.API.Connections("me").result( function(result) {
mydata = result;
} );
}
ExtJS4's store using proxy to load data, check below:
var myStore = Ext.create('Ext.data.Store', {
model: 'User',
proxy: {
type: 'ajax',
url : '/users.json',
reader: {
type: 'json',
root: 'users'
}
},
autoLoad: true
});
When executed, it reads data from the url
, /users.json
, and store into itself.
Also, if you want to process data yourself and load them into store yourself, you can check below:
//this is the model we will be using in the store
Ext.define('User', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'name', type: 'string'},
{name: 'phone', type: 'string', mapping: 'phoneNumber'}
]
});
//this data does not line up to our model fields - the phone field is called phoneNumber
var data = {
users: [
{
id: 1,
name: 'Ed Spencer',
phoneNumber: '555 1234'
},
{
id: 2,
name: 'Abe Elias',
phoneNumber: '666 1234'
}
]
};
//note how we set the 'root' in the reader to match the data structure above
var store = Ext.create('Ext.data.Store', {
autoLoad: true,
model: 'User',
data : data,
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'users'
}
}
});
And you could easily use setProxy
to change the behavior when you want.
Links:
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.