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
    36,632
    Answers
    3452
    Vote Rating
    817
    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
    4,800
    Answers
    359
    Vote Rating
    167
    slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold

      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
    4,800
    Answers
    359
    Vote Rating
    167
    slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold slemmon is a splendid one to behold

      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