Thursday, November 27, 2014

Globally disable sorting of Ext JS Grid when empty

This is specifically beneficial for stores that use remoteSort, as it will only conserve hitting the server when its empty, which potentially may trigger complex processing (such as search form validation or execute the sql query itself) even though it knows that it will return empty. You can disable this globally by overriding the Store's sort function like this, wherein you add a checking before calling the parent method (which will do its default behaviour):
Ext.define('Ext.overrides.data.Store', {
    override: 'Ext.data.Store',
    sort: function() {
        if (this.count() > 0) { //prevents from submitting a request, for remote sort
            this.callParent(arguments);
        }
    }    
});
This effectively prevents sorting across all your Grids that use a Store. No need to individually configure your Grid. Lastly, in relation to empty Stores and hitting the server, if you are using the Paging Toolbar, and your paging remotely, the Refresh button in that Toolbar by default will hit the server as well, hence do the same checking by overriding the doRefresh function:
Ext.define('Ext.overrides.toolbar.Paging', {
    override: 'Ext.toolbar.Paging',
    doRefresh: function() {
     var store = this.getStore();
        if (store && store.count() > 0) { //prevents from submitting a request, for remote refresh
            this.callParent(arguments);
        }
    }
});

No comments:

Post a Comment