React table not preserving location

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:

  1. 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.
  2. Dropdowns: When I select a city from a dropdown menu, the position in the table changes.

You can find my code at the following links:


https://github.com/swimmer11/mr_financestack_blitz_2

Question:

What could be the reason for these problems?

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.

Thanks in advance,

did you try their github issues section, if they have any similar topics already been addressed there?

happy coding :slight_smile:

I took a look if anybody had similar issues I could not find any

I also tried to downgrade my react version and my
Tanstack Table V8 version with no success.

  1. 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.

  2. 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.

Thank you for your answer

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.

I was able to find a solution

I needed to add

autoResetPageIndex: false, hook in my table instant

To make it work I was able to find a solution I needed to add
autoResetPageIndex: false, hook in my table instant
To make it work