Store global load event in MVC

[Arg0n]

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]

Ajax proxy uses Ext.Ajax to load things so you can hook into Ext.data.Connection where it does the actual XHR request.

[Arg0n]

Great idea, I will try that and maybe post how I did it ^^
Thx =)

[Arg0n]

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]

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]

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]

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]

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