rowsTotal reduced below displayed page's last row between pagination requests
rowsTotal reduced below displayed page's last row between pagination requests
We use server-side processing, getting the data (including total number of rows) from the backend using the ajax
feature.
We use button-based pagination in one and scroller for endless scrolling in the other situation.
Caused by an action by the user on the frontend, the backend may alter, even reduce or extent the result row set. The same user action then will cause a call of dataTable.draw('page');
leading to a fetch of the new data from the backend at the current page by datatable. The received data is passed to datatables while also passing a new (reduced/extented) recordsTotal
value along it. recordsFiltered
is always equal to recordsTotal
because the difference is always unknown.
When extending the total row count, causing even more pages to appear at the end of the table, datatables stays at the current page and even perfectly maintains its scroll position. In the reduction use-case the table does weird things and seems broken.
Let's imagine the following situation of a result set reduction: Say we are on page 10
of 10
, with 100
rows per page, showing row #901 to #1000 (so recordsTotal
is 1000
). Then the user action causes a reduction of the result row set and triggers the data update of datatables. The total number of rows is now reduced to 500
, so recordsTotal
received from the backend is also passed as 500
to datatable's calllback(data)
in the ajax function, along with an empty set of rows, because the requested rage of page 10
does not exist any longer.
In the scroller scenario, when being at getting a reduced result row set the following happens:
* Datatable scroller reduces the total height of the scroll area according to the new, reduced recordsTotal
* A scroll
event is triggered because the old scroll position cannot be maintained
* The scroll
event triggers a data request of the new position
* Eventually, the table renders but with no rows displayed
In the pagination scenario this is different:
* Datatable reduces the page count
* Eventually, the table renders but with no rows displayed
* document.querySelector('.d-table').getDataTable().page()
still shows 10
* No page button is selected
What would be the correct way to implement the behavior, that datatable displays the last possible range?
In the example above this would be:
* Scroller: Scroll to end of the table, rendering rows #500
* Pagination: Show page 5
, rendering rows #401 to #500