I’m building a React 18 application where I’m using Tanstack Table V8 to manage tables. I’m running into issues that are disrupting the user experience:
Editing cells: When I edit cells in the table (e.g., the first name), after saving the edit, the table “jumps” to a different location and doesn’t stay on the same row.
Dropdowns: When I select a city from a dropdown menu, the position in the table changes.
Are there specific settings in Tanstack Table V8 that I need to change? How can I keep the user’s position in the table after performing edit or selection actions from dropdowns?
I would really appreciate any help for this issue.
I don’t see that unless I sort the column I’m editing. If sort by name and change the name, it will obviously go to its new position.
Setting a city doesn’t do anything to the order when I set it, it also doesn’t seem to get saved, because if I sort by id twice when the item is back on the screen it doesn’t have the city set anymore.
The issue we are having if the table is set to let’s say 10 items per page and we are on the second page and we click on any item on the second page and edit that data the location is not preserved.
In order to illustrate the issue better I uploaded to GitHub a video showing the issue it can be found at the following folder “Video showing the issue” which is in the root of the project.