Upon deleting any row,pagination of Datatable not works properly

Harshad98

I implemented datatable and use the datatable features to display only table template(without data) and rendered the data using MatTableDataSource.

The data is fetch from the Database, backend is developed using spring boot.

When we try to delete any row, it gets deleted from Database , also in Angular frontend I am filtering the data from MatTableDataSource instance and rendering it.

But while rendering it displays all fetch data on the current page of pagination , here pagination pagelength property does not work also upon changing page and switch back to previous page the deleted data still persist.

Accepted Behaviour:
Upon any row deletion it should display fresh data on frontend with all pagination property should applied. Data should not append and upon switching page and go back to previous page deleted data should not persist.

How to handle pagination of datatable in angular mat-table.

kthorngren

Not sure what mat-table does nor how the delete process works. Sounds like you are populating the DOM with the table then initializing Datatables. You need to make sure Datatables initializes after the DOM table is built, not before, otherwise Datatables won't know about the table data. Also Datatables won't know about any changes made by directly manipulating the table through the DOM.

Datatables keeps a data cache of the table data to maintain the table display. Datatables knows about table changes by using Datatable APIs. See this FAQ for more details.

If this doesn't help then please provide more details of how the above works. Better is to provide a link to your page or a test case replicating the issues.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin