issue with pagingtoolbar on a livesearchgridpanel

Question

i'm trying to set a pagingtoolbar on my livesearchgridpanel.i'm getting the data over a Httpproxy ,so here is my store :

tempStore = new Ext.data.Store
    ({
        groupField     : default_groupby_s,
        model          : 'reportWorkspace',
        allowFunctions : true,
        autoSync       : false,
        pageSize       : 20,
        autoLoad       : true,
        remoteSort     : false,
        proxy          : new Ext.data.HttpProxy
        ({
            url           : url_s,
            actionMethods : 
            {
                read : 'POST'
            },
            reader        : 
            {
                type            : 'json',
                root            : 'workspace_report',
                successProperty : 'success'
            }
        })
    });
return tempStore ;
}

and here is my pagingtoolbar ,it will be included in my LivesearchgridPanel:

{
    xtype: 'pagingtoolbar',
    store: tempStore ,   
    dock: 'bottom',
    pageSize:20,
    displayInfo: true
}

the problem,it's that the pagingtoolbar is displaying pages correctly,but in the case of my grid,it displays ALL the data at the same time (in every page) . is it possible to do it without setting any starting point or limit in the autoload param ?? i just want to download all my data and then display it Correctly with pages

Any suggestion Please ?

Answer 1

I see several incosistencies:

1. LiveGrid was not built for paging at all but as an alternative to it.
2. ExtJS 4.1x no longer uses HTTP Proxy class but instead uses type: 'ajax' proxy config.
3. If you are going to page your data, you need to remote sort it, otherwise it won't make sense.
4. You have to make sure your grid panel and your pagingtoolbar refer to the same store instance. A common config for that in a grid panel is:

.

this.dockedItems = [
        {
            xtype:'pagingtoolbar',
            store:this.store, // same store GridPanel is using
            dock:'bottom',
            displayInfo:true
        }
    ];