PDA

View Full Version : Store global load event in MVC



Arg0n
26 Nov 2012, 12:37 AM
I want to listen on load of all stores. Is there a way I can do it in a MVC structure? :x

I already thought about extending from the 'Ext.data.Store' class, but it wont work, because the class extinding it needs to be a store itself. So I read about the observable class, but this seems to be the wrong way too...
I don't want to register a load listener for each store I have... I would lik eto have global load listener.

mitchellsimoens
27 Nov 2012, 12:39 PM
Ajax proxy uses Ext.Ajax to load things so you can hook into Ext.data.Connection where it does the actual XHR request.

Arg0n
27 Nov 2012, 11:47 PM
Great idea, I will try that and maybe post how I did it ^^
Thx =)

Arg0n
28 Nov 2012, 4:03 AM
Hmmm.... seems that this method isn't working for my usecase. The idea behind that is, that I want to create dependencies between stores. Means, if store 1 loads it should automaticly load store 2 too. For that I want to add an array in the stores with depedent stores. So I would need to have the actual store which is loading data. I can't figure out how I should get the store in the Ext.data.Connection class. =/

slemmon
28 Nov 2012, 7:54 AM
I might be off-base here and I haven't tested it, but what about:



Ext.data.StoreManager.on('add', function (i, store) {
store.on('load', function () {
MYAPP.app.fireEvent('storeload', o);
});
});

Ext.application({
name: 'MYAPP'
, launch: function () {
var me = this;
MYAPP.app = me; // a trick I learned from Mitchell
}
});

Arg0n
28 Nov 2012, 8:14 AM
Very interesting, but where to go with:



Ext.data.StoreManager.on('add', function (i, store) {
store.on('load', function () {
MYAPP.app.fireEvent('storeload', o);
});
});


I tried:



launch: function() {
CMS.app = this;
Ext.create('CMS.library.data.StoreLoader');
}




Ext.define('CMS.library.data.StoreLoader', {
constructor: function()
{
Ext.data.StoreManager.on('add', function (i, store) {
store.on('load', function () {


console.log('muh');
CMS.app.fireEvent('storeload');


});
});
}
});



but it doesn't work...

slemmon
28 Nov 2012, 10:08 AM
I tested just now with the following and it worked for me (using ExtJS 4.1.1a - I think you need 4.1.1 or higher for Ext.application's init method to fire - was a bug fix)

inside my Ext.application - moved setting up the global variable.app (MYAPP.app) to the init function of Ext.application instead.


init: function () {
var me = this;
MYAPP.app = me;
Ext.data.StoreManager.on('add', function (i, store) {
store.on('load', function () { // or datachanged or whatever you want
LARGE.app.fireEvent('storeload', store);
});
});
}


Now from any controller you can add a listener for 'storeload'. The below snippet I put in one of my controller's init function


me.application.on('storeload', function (store) { console.log(store); });


That's how I saw ... I think Tommy Maintz ... can't remember ... fire and handle application level events and it's worked well for me.

Arg0n
29 Nov 2012, 12:01 AM
Yay, worx ^^

How I did it:

app.js



Ext.application({
name: 'CMS',
appFolder: '../bundles/extjs/app',


controllers: [


//Andere
'CMS.controller.StoreLoader'


],


autoCreateViewport: true,




init: function () {
var me = this;
CMS.app = me;


Ext.data.StoreManager.on('add', function (i, store) {
store.on('load', function () {
CMS.app.fireEvent('storeload', store);
});
});
},


/**
* Wird aufgerufen, sobald ie Application bereit ist
*
* @return void
*/
launch: function() {
}


});


StoreLoader.js



Ext.define('CMS.controller.StoreLoader', {
extend: 'CMS.controller.AbstractController',


init: function()
{
var me = this;


me.application.on('storeload', function (store) { console.log(store); });
}
});


Thx! =D