This question is more a request for a suggested design based on the community's experience.
Essentially I need to paginate over a subset of API data from an API with limited search/filter and potentially large data volume.
Assume there is a service accessed via an API that has hundreds of records. The service returns pages of results 20 at a time (i.e. pagination). On my UI, I wish to display valid records from the records returned. However, not all records are valid and the API has essentially no filter feature.
The UI should always attempt to display 20 records even if another call to the API is needed. Calls to the API pass both a previous and a next page token. Can you suggest an ajax pagination strategy to display 20 valid records at a time, page for the additional records as needed and keep both the API calls and the UI display in sync while navigating to previous and next screens.
I'm considering on initial page load to grab a reasonably large number records from the API (ex. 500 records) on the server, filter server-side and pass valid records to the data option of the DataTables data source.
I'm hoping this not such a rare requirement.