I've run into a bit of an issue with a ScrollView and pagination when hooked up to a local data source. For our application, our customer has dictated requirements around data that must be front-loaded during application startup, one of which is a "client list" which can be several thousand records. This client list needs to be searchable by various fields. At least 8 records should be displayed at a time, and the list should be "swipe-able" to allow the user to navigate through the results (filtered or otherwise). We are brand new to Kendo UI, so I'd like to outline our approach and the problem that we are seeing.
We are able to successfully retrieve all of this data at application startup, and once we've retrieved all of our "client" records we set them as the .data property of a Kendo UI DataSource object. We then have a ScrollView set in data-bound mode that is pointing to this data source. The documentation says to set the data source page size to 4x the items-per-page of the scrollview, which we have done (32 in our case). The scroll view renders the data just fine, and even allows us to swipe through 4 pages of data before it stops allowing us to swipe and appears to "bounce" us back to the 3rd page. According to the debugger, once we swipe to the 4th page our template is invoked through some generated code only every item in the "data" array is marked "undefined" and our template breaks. I did see somewhere on the forums that paging local data sources for scroll views was not supported at one point but now is (sorry, I can't seem to find that post at the moment). I've created a Fiddle that reproduces the issue:
http://jsfiddle.net/n1m1dhw6/
We are using Kendo UI 2015.1.429.
1 Answer, 1 is accepted
Thank you for getting in touch with us.
When working with local data you should not set a pageSize. PageSize is required only in cases when remote paging is enabled.
Regards,
Alexander Valchev
Telerik