PDA

View Full Version : JsonStore Load Question



techakone
7 Oct 2010, 9:16 AM
Hi all,
I am working on an application where initially, i am using a JsonStore to retrieve the data i need to display, as well as all the constants i need for my comboboxes/radiogroups. Here is the code for the initial store, i call it datastore


var dataStore = new Ext.data.JsonStore({
storeId:'dataStore',
url:'json/dataService.json',
root:'dataRoot',
fields:
[
"id",
"UIConstant",
"storeList",
"findersList",
"storeInformation",
"success"
],
listeners:
{
load:function(store, recs)
{
//Now load all of the stores with the data we got
if(Ext.StoreMgr.get('storeListStore'))
{

Ext.StoreMgr.get('storeListStore').loadData(store.getAt(0).get('storeList'))
}
if(Ext.StoreMgr.get(findersListStore'))
{
Ext.StoreMgr.get('findersListStore').loadData(store.getAt(0).get('findersList'))
}

},
exception:function(proxy, type, action, options, response, args )
{
console.log("Type:" + type + "\nAction:" + action + "\nresponse:" + response + "\nargs: " + args );
console.dir(response);
console.dir(options)
}
}
});
dataStore.load();
}


And the stores definitions are as follow


var storeListStore = new Ext.data.JsonStore(
{
storeId:'storeListStore',
root:'storeList',
data:Ext.decode('{storeList:[]}'),
idProperty:'_commonRefValueId_',
fields:
[
"_commonRefTypeNm_",
"_effectiveDt_",
"_commonRefValueId_",
"_commonRefCode_",
"_commonRefValue_",
"_commonRefValueAbbr_",
"_commonRefVersNum_"
],
listeners:
{
load: function(store, recs)
{
console.log("Loaded Data forstoreListStoreStore: " + recs.length);
},
exception:function(proxy, type, action, options, response, args )
{
console.log("recallItemStatusStore Type:" + type + "\nAction:" + action + "\nresponse:" + response + "\nargs: " + args );
console.dir(response);
console.dir(options)
}
}
}
);


The problem i have is that, the components in my code that uses the storeList and findersList stores are initialized it seems before the stores are actually loaded. It seems that the load() event is called twice on the stores, once during initialization (at this point they all report 0 records) and another time after( where the records are correctly loaded and reported), by that time, the components that depended on the store do not have available records that they needed. The stores load fine, it's just a time line issue. Maybe i am not understand how the JsonStore functions and this is what i need your help with. I want to make sure all of my stores are loaded and ready to go before all the components are initialized.

Thanks

darthwes
7 Oct 2010, 9:38 AM
function commonError() {
var myStore = ...;
myStore.load();
doPostProcessing(myStore);
}

becomes


function commonError() {
var myStore = ...;
myStore.load({
callback: function() {
if(everythingReturnedProperly) {
doPostProcessing(myStore);
}
}
});
}

This is how you code in an asynchronous world. You must wait until the store is loaded (not intialized, the store is initialized in JS as a JS object, then it goes through a process (time) of requesting and receiving data).

techakone
7 Oct 2010, 9:47 AM
Thanks a bunch!!! I see now!

plalx
7 Oct 2010, 9:55 AM
var storeListStore = new Ext.data.JsonStore(
{
storeId:'storeListStore',
root:'storeList',
data:Ext.decode('{storeList:[]}'),


This triggers the load event, remove this line.

techakone
7 Oct 2010, 10:38 AM
var storeListStore = new Ext.data.JsonStore(
{
storeId:'storeListStore',
root:'storeList',
data:Ext.decode('{storeList:[]}'),


This triggers the load event, remove this line.
Indeed, that explains the two load events i was seeing, i thought that for the JSON store either then "data" or "url" properties where needed.