paging toolbar showing incorrect total number of pages(afterPageText)

Question

I am trying to add one paging toolbar in my existing toolbar and hide the first, previous, next, last and refresh button by using following code. My problem is that I am unable to fetch correct afterPageText value(total number of pages). I m doing this for resultlist in xCP Designer. Plz help.

CODE:

    
Ext.define('Override.toolbar.Paging', {
override: 'Ext.toolbar.Paging',
hideFirstButton: false,
hidePrevButton: false,
hideBeforePageText: false,
hidePageNumberField: false,
hideAfterPageText: false,
hideNextButton: false,
hideLastButton: false,
hideRefreshButton: false,   
getPagingItems: function() {
        var me = this;
        return [{
        itemId: 'first',
        tooltip: me.firstText,
        overflowText: me.firstText,
        iconCls: Ext.baseCSSPrefix + 'tbar-page-first',
        hidden: me.hideFirstButton,
        disabled: true,
        handler: me.moveFirst,
        scope: me
        }, {
        itemId: 'prev',
        tooltip: me.prevText,
        overflowText: me.prevText,
        iconCls: Ext.baseCSSPrefix + 'tbar-page-prev',
        hidden: me.hidePrevButton,
        disabled: true,
        handler: me.movePrevious,
        scope: me
        }, {
        xtype: 'tbseparator',
        hidden: me.hideFirstButton && me.hidePrevButton
        }, {
        xtype: 'tbtext',
        text: me.beforePageText,
        hidden: me.hideBeforePageText
        }, {
        xtype: 'numberfield',
        itemId: 'inputItem',
        name: 'inputItem',
        hidden: me.hidePageNumberField,
        cls: Ext.baseCSSPrefix + 'tbar-page-number',
        allowDecimals: false,
        minValue: 1,
        hideTrigger: true,
        enableKeyEvents: true,
        keyNavEnabled: false,
        selectOnFocus: true,
        submitValue: false,        
        isFormField: false,
        width: me.inputItemWidth,
        margins: '-1 2 3 2',
        listeners: {
        scope: me,
        keydown: me.onPagingKeyDown,
        blur: me.onPagingBlur
            }
        }, {
            xtype: 'tbtext',
            itemId: 'afterTextItem',
            hidden: me.hideAfterPageText,
            text: "of {0}"
        }, {
            xtype: 'tbseparator',
            hidden: me.hideNextButton && me.hideLastButton
        }, {
            itemId: 'next',
            tooltip: me.nextText,
            overflowText: me.nextText,
            iconCls: Ext.baseCSSPrefix + 'tbar-page-next',
            hidden: me.hideNextButton,
            disabled: true,
           handler: me.moveNext,
            scope: me
        }, {
            itemId: 'last',
            tooltip: me.lastText,
            overflowText: me.lastText,
            iconCls: Ext.baseCSSPrefix + 'tbar-page-last',
            hidden: me.hideLastButton,
            disabled: true,
            handler: me.moveLast,
            scope: me
        }, {
            xtype: 'tbseparator',
            hidden: me.hideRefreshButton
        }, {
            itemId: 'refresh',
            hidden: me.hideRefreshButton,
            tooltip: me.refreshText,
            overflowText: me.refreshText,
            iconCls: Ext.baseCSSPrefix + 'tbar-loading',
            handler: me.doRefresh,
            scope: me
        }];
    }
});
xcp.widget.grid.ResultsListGrid.override({
        initComponent: function () {
            var me = this;
            this.dockedItems = [
   {
                xtype: 'toolbar',
    //store: me.store,
                dock: 'bottom',
    height: '45px',
                items: [
                    //'->',//right alight the button
     {
                xtype: 'xcp_pagingtoolbar',
                store: me.store,
    //flex: true,
                dock: 'bottom',
                displayInfo: true
            },'->',
   {
   xtype: 'pagingtoolbar',
            store: me.store,
   displayInfo: false,
    hideRefreshButton: true,
                hideFirstButton: true,
                hideLastButton: true,
                hidePrevButton: true,
                hideNextButton: true,
    //disabled: true
   }
                    ]
            },    
   ];
            this.callParent();
        }
    }
);

Thanks. -SS

Answer 1

Incorrect total number of pages, or any discrepancy in paging info, are almost always caused by an incorrect server response.

If we have configured pageSize:20 and we want page 2, server must return exactly 20 records, starting from record 21 (1 based numbering) and must return correct total number of records in the table.