'Prevent re-sort on data change or while row is being edited
On react-table when the table is sorted and data changes, the table can either reset (go to default sort state) or re-sort (by putting the edited row in the correct place and keeping the column sort selection)
This is handled by autoResetSortBy: Boolean
Is there a way to simply keep the table in an out of order state once data is edited? If a user is editing multiple values in a row, the row might jump around if they edit the cell the table is sorted by. I wish to have the table keep the row in place at least while it's being edited
https://codesandbox.io/s/practical-napier-ksgfx
- Sort by name column
- edit the name cell in one of the rows, then click on another cell within the same row
- the row will jump to another place because the table was re-sorted
Solution 1:[1]
A bit late to the game, but I'm posting a response now in the hope that it helps others.
Here is a link with a good answer: https://react-table.tanstack.com/docs/faq#how-do-i-stop-my-table-state-from-automatically-resetting-when-my-data-changes
TLDR: add these to your useTable args list:
autoResetPage: false, autoResetExpanded: false, autoResetGroupBy: false, autoResetSelectedRows: false, autoResetSortBy: false, autoResetFilters: false, autoResetRowState: false,
Hope this helps :)
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | mattBurnett |