PrimeReact DataTable paginator is not working properly.

[geeky01adarsh]

When I tried using the props passed through the Datatable paginator it didn't work. Also, we don't have the onPageChange with the DataTable.

Framework:- Next
Code:-

<DataTable paginator rows={5} totalRecords={100} value={data} stripedRows />

Here data had 5 elements and the total no. of pages shown was 1 only, while it must be 20.

I wanted to make paginated API calls, and on-page changes rather than getting all the data simultaneously.

[buraksaglam089]

Hello ,

To make paginated API calls using PrimeReact's DataTable component, you can utilize the onPage prop. This prop allows you to define a callback function that gets triggered when the pagination state changes, enabling you to update your data or make API calls accordingly

Regards.

[geeky01adarsh]

The totalRecords is not working, i.e., if my data have 5 elements only then, I am not getting the option for the second page.

The main issue for me is I can't utilize totalRecords.

[geeky01adarsh]

It works after adding lazy keyword.

<DataTable paginator rows={5} totalRecords={100} lazy value={data} stripedRows />

[MarielaRH]

I've been fighting for a long time with that, thanks!

[bmbravo]

Just spent 3 hours looking for this solution, thanks 😆

[aakashjoshi1386]

Yes this hack is working with respect to paging API, I've spent many hours. But this helped and save it. Thanks for posting!

[innotexak]

A life saver indeed. Thank you