mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
3.79k stars 1.12k forks source link

Nested (Master/Detail) DataGrid row editing unexpected behavior #12820

Closed skopsan closed 2 weeks ago

skopsan commented 2 weeks ago

Steps to reproduce

Link to live example: https://codesandbox.io/p/github/skopsan/sb-mui-grid-demo/main

Steps:

  1. Open the details of a row
  2. Click on the edit button

Current behavior

Immediately after the edit button was clicked, the dropdown field to edit the "singleSelect"-type column "Product" opens. You cannot select the previously selected value. You cannot close it with "ESC".

Expected behavior

The row should become editable and the dropdown should not open unless you click it.

Context

A datagrid that displays deliverynotes (date / issuer / document nr) and can be expanded to see all line items. The user should be able to edit specific line items.

Your environment

npx @mui/envinfo ``` System: OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish) Binaries: Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm pnpm: Not Found Browsers: Firefox & Chrome (most recent versions) npmPackages: @emotion/react: ^11.11.4 => 11.11.4 @emotion/styled: ^11.11.5 => 11.11.5 @mui/base: 5.0.0-beta.40 @mui/core-downloads-tracker: 5.15.15 @mui/icons-material: ^5.15.15 => 5.15.15 @mui/material: ^5.15.15 => 5.15.15 @mui/private-theming: 5.15.14 @mui/styled-engine: 5.15.14 @mui/system: 5.15.15 @mui/types: 7.2.14 @mui/utils: 5.15.14 @mui/x-data-grid: 7.2.0 @mui/x-data-grid-generator: ^7.2.0 => 7.2.0 @mui/x-data-grid-premium: 7.2.0 @mui/x-data-grid-pro: ^7.2.0 => 7.2.0 @mui/x-license: 7.2.0 @types/react: ^18.2.66 => 18.2.79 react: ^18.2.0 => 18.2.0 react-dom: ^18.2.0 => 18.2.0 ```

Search keywords: datagrid nested editing master detail Order ID: 78409

github-actions[bot] commented 2 weeks ago

:warning: 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.

@skopsan: 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.

skopsan commented 2 weeks ago

In case anyone stumbles across a similar issue: editMode="row" was missing