Tuesday 26 February 2019

DataTables scroll to row with ajax paginated data

In DataTables I can automatically add an ID to each <tr> row of my table by specifying DT_RowId in my ajax response data. This means that each row gets an id attribute, e.g.

<tr id="row_45">
    <td>foo</td>
    <td>bar</td>
</tr>

This is useful in my application because it means I can use URL's such as: /#row_45 and show row 45 at the top of the page.

This works fine providing the rows are on page 1.

My application shows 250 rows per page and each page is generated with an ajax request. Sometimes there are >1000 pages. So if I tried to open row 999 (/#row_999) in the same way, it doesn't work, because that isn't on the first page.

I am using pagination and DataTables in "serverSide" mode. This means that all of the data is not present on page load - making this problem harder. If I click "page 3" in the pagination it does an ajax request for records 750 - 1000 (250 per page). So all of the data is not available until the user goes through the pagination, which is why this is difficult.

Does anyone know if there's a workaround to this?

DataTables version 1.10.16



from DataTables scroll to row with ajax paginated data

No comments:

Post a Comment