DeLe
DeLe

Reputation: 2480

How to mask treepanel until loading success

I define a treepanel. And i try add mask() for waiting tree is loading done. But not working.

Here is my code

Ext.define('Example.example', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.example',
    title: 'example',
    store: Ext.create('Ext.data.TreeStore', {
    ...
    listeners: {
        'load': function (store, records, success) {
            Ext.ComponentQuery.query('example').getEl().unmask(); // not working
        },
        'beforeload': function (store, options) {                                    
            Ext.ComponentQuery.query('example').getEl().mask();// not working
        }
    }
})
});

How to make that working thank.

Upvotes: 1

Views: 3654

Answers (2)

rixo
rixo

Reputation: 25041

EIther use the undocumented ownerTree property:

beforeload: function() {
    this.ownerTree.getEl().mask("Loading", 'x-mask-loading');
}

Or register your listeners in a method in order to get the scope:

Ext.define('Example.example', {
    // ...
    ,initComponent: function() {
        this.callParent(arguments);

        this.getStore().on({
            scope: this
            ,beforeload: function() {
                this.getEl().mask("Loading", 'x-mask-loading');
            }
        });
    }
});

Upvotes: 3

kuldarim
kuldarim

Reputation: 1106

try this one Ext.ComponentQuery.query('example').body.mask(); use body instead of getEl()

Upvotes: 0

Related Questions