ExtJS 4.1 Store & PagingToolBar Dynamic PageSize

Problem:

How to dynamically set the new pageSize of the store and update the total page number in PagingToolBar with the new PageSize?

Here we also assume that the store must reload after the new pageSize is assigned.

Solution:

pageSize is not only a config of store but also a property of store! (this is not in the ExtJS 4.1 document)

If you want to programmatically change the pageSize of store, just assign the new value to store's pageSize, and load the store again.

How about the total page number in pagingtoolbar?

The total page of the pagingtoolbar will update when the store load is completed and it will calculate with the total row count returned in store data (if you don't have one, you cannot use pagingtoolbar) and the pageSize property of the store. So no worries! The total page number will update by itself once you've updated the pageSize of the store!

Problem solved.