Sencha Touch List Paging: limit number of record of the store

Question

I'm using Sencha Touch List (xtype: list) on my apps, with listPaging plugin. It works like a charm on creating infinite effect, by setting autopaging: true.

BUT, my question is, how to keep the records of the store (or rows on the list) into some number only, e.g 50 records.

So, when user scrolls down, automatically load next page, while removing previous (current) page, and on scrolling up, load previous page.

the goal is, to limit number of record of the store, because if it is loaded all (by keep scrolling down), it crashes the device (tested on Ipad).

It makes sense, I have 40k records on db.

Answer 1

Yesterday I was working on something like this but only with the next functionality.

You can override the method which loads the new page on the fly. It is loadNextPage() and add store.removeAll() before requesting the next page.

In your list:

plugins: [
    {
        type: 'listpaging',
        autoPaging: true,
        noMoreRecordsText: null,
        loadMoreText: null,
        loadNextPage: function() {
            var me = this;
            if (!me.storeFullyLoaded()) {
                me.getList().getStore().removeAll();
                me.getList().setMasked(true);
                me.getList().getStore().nextPage({ addRecords: true });
            }
        }
    }
]

This is only for the Next, It could be a little more complicated for the previous but maybe this can give an idea. Probably adding another cmp to the top of the list which fires store.previousPage()

Hope it helps-