1. #1
    Sencha User Arg0n's Avatar
    Join Date
    Apr 2012
    Location
    Germany
    Posts
    122
    Answers
    12
    Vote Rating
    16
    Arg0n will become famous soon enough Arg0n will become famous soon enough

      0  

    Default Answered: Store global load event in MVC

    Answered: Store global load event in MVC


    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.

  2. 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.
    Code:
    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
    Code:
    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.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,327
    Answers
    3540
    Vote Rating
    850
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Ajax proxy uses Ext.Ajax to load things so you can hook into Ext.data.Connection where it does the actual XHR request.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User Arg0n's Avatar
    Join Date
    Apr 2012
    Location
    Germany
    Posts
    122
    Answers
    12
    Vote Rating
    16
    Arg0n will become famous soon enough Arg0n will become famous soon enough

      0  

    Default


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

  5. #4
    Sencha User Arg0n's Avatar
    Join Date
    Apr 2012
    Location
    Germany
    Posts
    122
    Answers
    12
    Vote Rating
    16
    Arg0n will become famous soon enough Arg0n will become famous soon enough

      0  

    Default


    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. =/

  6. #5
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    5,357
    Answers
    431
    Vote Rating
    200
    slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of

      0  

    Default


    I might be off-base here and I haven't tested it, but what about:

    Code:
    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
        }
    });

  7. #6
    Sencha User Arg0n's Avatar
    Join Date
    Apr 2012
    Location
    Germany
    Posts
    122
    Answers
    12
    Vote Rating
    16
    Arg0n will become famous soon enough Arg0n will become famous soon enough

      0  

    Default


    Very interesting, but where to go with:

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

    Code:
        launch: function() {
            CMS.app = this;
            Ext.create('CMS.library.data.StoreLoader');
        }
    Code:
    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...

  8. #7
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    5,357
    Answers
    431
    Vote Rating
    200
    slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of slemmon has much to be proud of

      1  

    Default


    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.
    Code:
    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
    Code:
    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.
    Last edited by slemmon; 28 Nov 2012 at 10:10 AM. Reason: changed datachanged event to load

  9. #8
    Sencha User Arg0n's Avatar
    Join Date
    Apr 2012
    Location
    Germany
    Posts
    122
    Answers
    12
    Vote Rating
    16
    Arg0n will become famous soon enough Arg0n will become famous soon enough

      0  

    Default


    Yay, worx ^^

    How I did it:

    app.js

    Code:
    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

    Code:
    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

Thread Participants: 2

Tags for this Thread