ExtjS4中的分页工具栏问题

Question

i am new to ExtJS4.I am using paging toolbar in our project.I am clearing the grid using

grid.getStore().removeAll()

Now problem is with paging toolbar.If we click on the buttons then it is retrieving the store.My doubt is how to clear store in paging toolbar?

Please help me.

Thanking you,
Kushal

Answer 1

I just spent a few hours researching this thing and wanted to share in case someone is still looking for it. It looks like Ext.toolbar.Paging does not listen to the clear event of the store which fires on the removeAll() method. My solution was to sub class it and override getStoreListeners to bind onLoad internal function to the clear event. I am using ExtJS 4.1 by the way.

Ext.define('MyApp.ClearablePagingToolbar', {
    extend: 'Ext.toolbar.Paging',
    alias: 'widget.clearablepagingtoolbar',
    getStoreListeners: function () {
        var listeners = this.callParent();

        Ext.apply(listeners, {
            clear: this.onLoad
        });

        return listeners;
    }
});

You use it by referencing clearablepagingtoolbar in your grid like this:

dockedItems: [{
    xtype: 'clearablepagingtoolbar',
    dock: 'bottom',
    displayInfo: true,
    store: this.getSearchResultStore()
}]

Answer 2

First of all, do you have the same store configured for both the grid and the toolbar? If yes, you should try to clear the store itself, and not by using grid.getStore() (eg myStore.removeAll() )

Answer 3

If you grid and paging toolbar uses same store, your paging toolbar will work correct. If you use separate stores (It is bad coding style), you need to call this paging panel's store's sync method, to syncronize data.