Results 1 to 8 of 8

Thread: Loading mask not setting for bound store loaded in ViewController.init

    Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-17254 in 6.5.0.775.
  1. #1
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404

    Default Loading mask not setting for bound store loaded in ViewController.init

    I have a grid that's bound to a store... in the init of the ViewController, I load the store, but when I do this, the loading mask is not applied to the grid... however, if I set a timeout of 1 millisecond and then load the store, the loading mask is applied... I'm assuming that's because it gets pushed onto the call stack. Also, if I use a store that's not bound, I don't have this issue.

    Please take a look at this Fiddle. It's very quick, but what happens is when the Fiddle loads, the top grid will not have a loading mask, whereas the bottom grid does. I found this thread, but it appears the bug has been closed... I've tried both v5.1.1.451 and v5.1.0.107 but no dice. I've also tried adding a loadingHeight (VIA this suggestion from evant), but same results. Code:

    Code:
    Ext.application({
        name : 'Fiddle',
    
        launch : function() {
            Ext.define('MyModel', {
                extend: 'Ext.data.Model',
                fields: ['name']
            });
            var myStore = Ext.create('Ext.data.Store', {
                model: 'MyModel',
                proxy: {
                    type: 'ajax',
                    url: 'data1.json',
                    reader: {
                        type: 'json'
                    },
                    limitParam: null
                }
            });
            Ext.define('MyBoundViewController', {
                extend: 'Ext.app.ViewController',
                alias: 'controller.myboundview',
                init: function() {
                    var myBoundStore = this.getStore('myBoundStore');
                    myBoundStore.load();
                    setTimeout(function() {
                        myBoundStore.load();
                    }, 2000);
                }
            });
            Ext.define('MyViewController', {
                extend: 'Ext.app.ViewController',
                alias: 'controller.myview',
                init: function() {
                    myStore.load();
                    setTimeout(function() {
                        myStore.load();
                    }, 2000);
                }
            });
            Ext.define('MyViewModel', {
                extend: 'Ext.app.ViewModel',
                alias: 'viewmodel.myview',
                stores: {
                    myBoundStore: {
                        model: 'MyModel',
                        proxy: {
                            type: 'ajax',
                            url: 'data1.json',
                            reader: {
                                type: 'json'
                            },
                            limitParam: null
                        }
                    }
                }
            });
            Ext.define('MyBoundGridView', {
                extend: 'Ext.grid.Panel',
                controller: 'myboundview',
                title: 'My Bound Store Grid',
                viewModel: {
                    type: 'myview'
                },
                bind: {
                    store: '{myBoundStore}'
                },
                //store: myStore,
                columns: [{
                    text: 'Name', dataIndex: 'name'
                }],
                height: 200,
                width: 600
            });
            Ext.define('MyView', {
                extend: 'Ext.grid.Panel',
                controller: 'myview',
                title: 'My Grid',
                store: myStore,
                columns: [{
                    text: 'Name', dataIndex: 'name'
                }],
                height: 200,
                width: 600
            });
            Ext.create('MyBoundGridView', {
                renderTo: Ext.getBody()
            });
            Ext.create('MyView', {
                renderTo: Ext.getBody()
            });
        }
    });

  2. #2
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,579

    Default

    What if you configure the store to autoLoad: true and skip calling it in the controller. Does it still happen?

    I'm able to reproduce this in the fiddle, but not locally.
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  3. #3
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404

    Default

    That seems to fix the issue, but that's besides the point, as I do not want to use autoLoad true.

  4. #4
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,579

    Default

    We've went ahead and re-opened the original bug report of this since the issue appears to be present is current versions. EXTJS-17254
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  5. #5
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404

    Default

    Awesome, thanks!

  6. #6
    Sencha Premium User wemerson.januario's Avatar
    Join Date
    Nov 2008
    Location
    Goiânia - GO, Brazil
    Posts
    883

    Default

    Any news? Fix? Override?Workaround?

    Thanks
    Wemerson Januario @JanuarioCoder
    Novanti Tecnologia, Sencha MVP/ Ext JS Consultant
    ____________________________________________
    Hire me on UpWork:

    GitHub
    https://github.com/wemersonjanuario

    Treinamento e Consultoria Ext JS. QUALIFIQUE-SE JÁ!

  7. #7
    Sencha Premium User
    Join Date
    Feb 2012
    Posts
    84

    Default

    Please see my first attempt at an override fix here: https://www.sencha.com/forum/showthr...=1#post1134898

  8. #8
    Sencha Premium User wemerson.januario's Avatar
    Join Date
    Nov 2008
    Location
    Goiânia - GO, Brazil
    Posts
    883

    Default

    Quote Originally Posted by mattjenkins View Post
    Please see my first attempt at an override fix here: https://www.sencha.com/forum/showthr...=1#post1134898
    Thanks you!
    Wemerson Januario @JanuarioCoder
    Novanti Tecnologia, Sencha MVP/ Ext JS Consultant
    ____________________________________________
    Hire me on UpWork:

    GitHub
    https://github.com/wemersonjanuario

    Treinamento e Consultoria Ext JS. QUALIFIQUE-SE JÁ!

Similar Threads

  1. Replies: 6
    Last Post: 31 Aug 2012, 2:07 AM
  2. hide loading mask when store is loaded using store.load
    By vijay.chauhan in forum Sencha Touch 2.x: Q&A
    Replies: 1
    Last Post: 22 Jun 2012, 10:13 AM
  3. Store load with funky loading mask
    By dgotty in forum Sencha Touch 2.x: Q&A
    Replies: 2
    Last Post: 8 Mar 2012, 11:30 AM
  4. Chart: Loading mask on ajax data store?
    By jmefford in forum Ext: Discussion
    Replies: 2
    Last Post: 15 Sep 2011, 1:09 AM
  5. I wont get a loading mask when i do store.reload()
    By localhost in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 20 Oct 2008, 8:10 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •