PDA

View Full Version : how to know first page,previous,next,last page button in PagingToolbar?



poojagarg89
10 Aug 2012, 3:27 AM
Here is the PagingToolbar I want to do some things on click of 'First Page', 'Previous', 'Next', 'Last Page'
How to get these values??

My code:


var cash_ledger_pagingBar= new Ext.PagingToolbar({
pageSize: 2,
store:cash_ledger_ds,
displayInfo: true,
items:[" "," "," "," "," "," "," "," "," "," ",
" "," "," "," "," "," "," "," "," "," "," "," "," "," "," "," ",{
xtype: "label",
text: "Debit Sum :"
},{
xtype: "textfield",
id: "debit_sum",
name: "debit_sum",
width: 50
}," ","-",{
xtype: "label",
text: "Credit Sum :"
},{
xtype: "textfield",
id: "credit_sum",
name: "credit_sum",
width: 50
}],
displayMsg: 'Displaying records {0} - {1} of {2}',
emptyMsg: "No records to display",
listeners:{
change: function(cash_ledger_pagingBar, pageData){
// How to get that 'First Page', 'Previous', 'Next', 'Last Page' button is pressed?

}
}
});



Image :
37849

Thanks in advance...!!!

Regards,
Pooja

willigogs
10 Aug 2012, 4:11 AM
Not sure if there's a better way to achieve this, but you could certainly hook into the afterrender event of the toolbar, then add event listeners to each of the buttons.

e.g:


var pagingtoolbar = {
xtype: 'paging',
store: store,
listeners: {
afterrender: {
single: true,
fn: function(thispaging) {
thispaging.first.on('click', function() {
console.log('First')
});
thispaging.prev.on('click', function() {
console.log('Prev')
});
thispaging.next.on('click', function() {
console.log('Next')
});
thispaging.last.on('click', function() {
console.log('Last')
});
}
}
}
};

poojagarg89
10 Aug 2012, 4:19 AM
hey thanks a lot :)

It worked :)

@naresh
29 May 2014, 11:27 PM
thanks