PDA

View Full Version : paging toolbar showing incorrect total number of pages(afterPageText)



shashank329
12 Jan 2015, 2:10 AM
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.

51480
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();
}
});

joel.watson
14 Jan 2015, 6:18 AM
Hi shashank329--

The first question I would have is whether it works correctly when you use the pagingtoolbar without applying your overrides. If so, then it must be coming from something you have added or inadvertently omitted. If you get the same results in the out-of-the-box toolbar as with your custom override, then there must be something not configured correctly in your data and how the reader is interpreting the size of the store.

Since you seem to really only want to show the "info" in the toolbar, you might find it's easier to simply create a custom extension (not override) of a toolbar that simply shows the data.

Do you have a test case you can post with your custom override of the pagingtoolbar? Feel free to create a fiddle here: https://fiddle.sencha.com. That would definitely help in debugging your issue.

Thanks!