CODEWITHSUNDEEP
javascriptextjs
MBU
MBU

Reputation: 5098

Ext.PagingToolbar not working properly

I have a grid that displays images based on a category selection box next to the grid. For example if the all photos tab is selected, the grid displays all photos. If the hawaii tab is selected it only displays photos from hawaii. I have a mediaStore that keeps track of all the images. 

bbar: new Ext.PagingToolbar({
        pageSize: 25,
        store: mediaStore,
        displayInfo: true,
        displayMsg: 'Displaying images {0} - {1} of {2}',
        emptyMsg: "No data to display"
    })

Here is the code i used to display the paging tool bar. It works perfectly for the all photos tab but when i click on any other category, say a category that has 50 photos, it displays 1 page of 2 with the next and back buttons. If you click on the next button, the grad switches back to displaying the all photos category and the page number jumps from 1 of 2 to 2 of 5 instead of 2 of 2. Does anyone know what the problem could be?

Upvotes: 0

Views: 1007

Answers (2)

MBU
MBU

Reputation: 5098

I ended up setting the baseParams to contain a selectionid and initially set it to '' in the jsonstore. 

baseParams: 
{
    selectionid: ''
}

then when a selection is changed i modified the value of the baseParam using

mediaStore.setBaseParam('selectionid', record.id);

Upvotes: 0

Abdel Raoof Olakara
Abdel Raoof Olakara

Reputation: 19353

This is because your mediaStore still contains all the records (image details). The filtering is just hiding the rows. Call the load method after you call the filterBy method:

mediaStore.load(mediaStore.lastOptions);

Upvotes: 1

Related Questions