Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[data grid] Export to Excel causes rows to be misaligned from their headers (with checkboxes present) #12641

Closed
Spencer-Vega opened this issue Apr 2, 2024 · 5 comments · Fixed by #13191
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Export regression A bug, but worse v7.x

Comments

@Spencer-Vega
Copy link

Spencer-Vega commented Apr 2, 2024

Steps to reproduce

Link to live example: Example from MUI X Documentation

Steps:

  1. Navigate to the table example in the Using a web worker section.
  2. Use Export button and select Download as Excel
    (Export to Excel on a Mui Datagrid table where there are Checkboxes on table)

Current behavior

  • File is downloaded on machine.
  • After some time table items (rows) get misaligned from their column headers.

Expected behavior

  • File is downloaded on the machine.
  • No change in column positioning should take place.

Context

Just trying to export rows in the MUI Data Grid.
(And I did not notice this issue when exporting to Excel on tables without checkboxes)

Your environment

Occurs in the MUI Documentation
Browser: Chrome - Version 123.0.6312.87 (Official Build) (arm64)

Search keywords: export to excel, datagrid with checkboxes
Order ID: 87625

@Spencer-Vega Spencer-Vega added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Apr 2, 2024
@MBilalShafi MBilalShafi added component: data grid This is the name of the generic UI component, not the React module! regression A bug, but worse feature: Export v7.x and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Apr 3, 2024
@MBilalShafi
Copy link
Member

Thank you @Spencer-Vega for reporting.

I noticed this happens only on the v7 version, so I am guessing it might be a side effect of sticky headers or some other related update.

@romgrk Feel free to guess what could be the root cause (if possible)

I'll add it to the board for the team to prioritize a fix.

@github-project-automation github-project-automation bot moved this to 🆕 Needs refinement in MUI X Data Grid Apr 3, 2024
@romgrk
Copy link
Contributor

romgrk commented Apr 3, 2024

The width is explicitly set to 110px so it could be tied to the state & column width bugs that we've explored in other issues.

@Spencer-Vega
Copy link
Author

Not sure if it is helpful at all, but it is reproducible with tables that are only using flex and not explicit widths set.

@dassoumyashree
Copy link

Any update on this issue? Due to this, I am not able to use data-grid latest version, as upon export the entire grid rows get misaligned from header.

Copy link

⚠️ This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@Spencer-Vega: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: data grid This is the name of the generic UI component, not the React module! feature: Export regression A bug, but worse v7.x
Projects
Status: Done
Development

Successfully merging a pull request may close this issue.

4 participants