[data grid][dialog] The DataGrid's horizontal scroll resets to its default position automatically. #17784
Labels
bug 🐛
Something doesn't work
component: data grid
This is the name of the generic UI component, not the React module!
status: waiting for maintainer
These issues haven't been looked at yet by a maintainer
support: pro standard
Support request from a Pro standard plan user. https://mui.com/legal/technical-support-sla/
Steps to reproduce
I’m using a Dialog component together with a DataGrid. When the sort method is changed, the onSortModelChange function is triggered, followed by a re-render of the Dialog and the DataGrid. In about 50% of cases, a bug occurs: during horizontal scrolling, the table may automatically scroll back to the initial position.
Focus remains on a table cell, and it seems that autofocus is being triggered, which scrolls the view back to the column that controls sorting.
I tried using the following Dialog props:
…but none of them helped. The only workaround that currently works for me is manually clearing the focus after changing the sort model using document.activeElement?.blur?.();
Current behavior
After changing the sorting method, horizontal scrolling in the DataGrid resets and focuses back on the sorted column automatically
Expected behavior
The horizontal scroll should not automatically return to the initial position or to the sorted column
Context
Is there any way to avoid focusing on the cell without using the workaround with document.activeElement?.blur?.()?
At the moment, it’s unclear to me whether this issue comes from the Dialog, which might be trying to scroll to the first focusable element, or from the DataGrid itself.
Your environment
npx @mui/envinfo
Search keywords: DataGrid, Dialog, focus, scroll
Order ID: 110382
The text was updated successfully, but these errors were encountered: