View Full Version : pagingtoolbar - busy icon when next or previous buttons clicked

4 Nov 2014, 8:11 AM
Hello all,

I have a results grid and I am implementing the pagination here using the xtype: 'pagingtoolbar',. Everything is working fine as it should be and I don't have any issues with the pagination. But when a user clicks on the 'Next Page' button, it is taking some time to display the next page and the user is not able to understand if it is really going to display the next page. It takes almost 4-5 seconds for the 2nd page or the next page or the previous page to load. This is making the user to click the button multiple times thinking nothing is happening. So is there a way where I can display a spinning wheel or some loading icon while the next page displays so that the user knows something is happening. Where should I do this change?.


4 Nov 2014, 12:35 PM
We are going to need more info.

How much data is sent per page (# records)
What Browser?

There should be no reason for it to take 4-5 seconds per page.

4 Nov 2014, 12:51 PM
Hi Scott,

This is happening in IE 9 and Firefox browsers. we have 300 records returned for each page. It is taking something around 15 seconds for the page to change and there are 45 columns for each record. Not sure if the high number of columns is the reason for the delay because for another page where there are 25 columns it is taking 5 seconds for the 300 records to load when I click on the next or the previous buttons.


4 Nov 2014, 12:57 PM
I suspected you were on IE for this slow result.

If you are using paging?, why 300 records? You should only need to load what the screen can present on 1 page.

You may want to have a look at the bufferedRenderer plugin to load the records in sections.
So with 10K records, it loads leading, visible, trailing and as you scroll, it recycles.

plugins: {
ptype: 'bufferedrenderer',
trailingBufferZone: 20,
leadingBufferZone: 50