How can I perform client side sorting with Ext JS 4?

Question

I have a Grid Panel that loads about 200 records from the server. I can implement a paging bar just fine, so that I load 10 records per page. However, the problem is that when our users click a column (such as Customer) to sort, it only sorts the local 10 rows.

When they go to the next page, it isn't sorted and they get confused. I thought about pulling all 200 records down at once and try paging that way. I know it's not the best way but I can't think of another solution.

PLUS, our remote sorting routine can't really be changed due to timing constraints. It only handles offset and limit. So I can easily bring all 200 down but I can't alter how the columns are sorted.

Thanks.

Answer 1

I think the way you are doing it makes the most sense (since you can't sort the 200 results in place, although I'm not 100% on why). You just need to implement a way to remember the sorting option the user chose, and carry this forward to the next page.

EDIT: http://docs.sencha.com/ext-js/4-0/#!/guide/data has a section on sorting. Also take a peek at http://docs.sencha.com/ext-js/4-0/#!/api/Ext.data.SortTypes.