search

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.99k stars 1.23k forks source link

[data grid] Grouping cells editing #7643

Open jlkoszarek opened 1 year ago

jlkoszarek commented 1 year ago

Order ID 💳

57814

Duplicates

Latest version

The problem in depth 🔍

I'm using DataGrid Premium as a tree table with row editing enabled. At this poiint I can't seem to enable the editing of the Group column cell values. The other cells in the row are editable. I took your basic tree grid example modified a bit to illustrate the problem with trying to edit the Group cell value. So is there a way to enable row editing for all cells in a tree grid?

jsx file uploaded as a txt file: DataGrid Edit Tree Group Cell.txt

Your environment 🌎

`npx @mui/envinfo` ``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```

System: OS: Windows 10 10.0.22000 Binaries: Node: 19.4.0 - C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: 9.3.0 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: Not Found Edge: Spartan (44.22000.120.0), Chromium (108.0.1462.76) npmPackages: @emotion/react: ^11.10.5 => 11.10.5 @emotion/styled: ^11.10.5 => 11.10.5 @mui/base: 5.0.0-alpha.113 @mui/core-downloads-tracker: 5.11.4 @mui/icons-material: ^5.11.0 => 5.11.0 @mui/material: ^5.11.4 => 5.11.4 @mui/private-theming: 5.11.2 @mui/styled-engine: 5.11.0 @mui/system: 5.11.4 @mui/types: 7.2.3 @mui/utils: 5.11.2 @mui/x-data-grid: 5.17.19 @mui/x-data-grid-premium: ^5.17.19 => 5.17.19 @mui/x-data-grid-pro: 5.17.19 @mui/x-license-pro: 5.17.12 @types/react: 18.0.26 react: ^18.2.0 => 18.2.0 react-dom: ^18.2.0 => 18.2.0 typescript: 4.9.4

m4theushw commented 1 year ago

At this moment there's no way to enable the editing of the cells from the grouping column. Do you want to edit the cells in children rows or also in parent rows?

jlkoszarek commented 1 year ago

Both. but only one row/level at a time. So you can change the parents name or a child names in one transaction along with other attributes of the row. A common UI pattern is to have a New button on the toolbar in which you have selected the parent for the new child. Once the child is created, you then allow the user to change the name of the new child as well as other attibutes in the same transaction. PS - have you consider having and id path for representing the tree's parent/child relationships and a separate column for the displayed value/name at that group column's cell, so edits would be against the dsiplyed name column instead of the hierarchy?

jlkoszarek commented 1 year ago

I added a comment to the issues.

From: Matheus Wichman @.> Sent: Monday, January 23, 2023 9:46 AM To: mui/mui-x @.> Cc: Joe Koszarek @.>; Author @.> Subject: Re: [mui/mui-x] DataGrid Premium Tree Edit Group cells (Issue #7643)

At this moment there's no way to enable the editing of the cells from the grouping column. Do you want to edit the cells in children rows or also in parent rows?

— Reply to this email directly, view it on GitHub https://github.com/mui/mui-x/issues/7643#issuecomment-1400737668 , or unsubscribe https://github.com/notifications/unsubscribe-auth/ABFYSYJOG43UKNSZO2UQ3KDWT27UHANCNFSM6AAAAAAUCDS4UM . You are receiving this because you authored the thread. https://github.com/notifications/beacon/ABFYSYJWZAVCHQDIYQPDWKLWT27UHA5CNFSM6AAAAAAUCDS4UOWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTSTPWHYI.gif Message ID: @. @.> >

jfsaman commented 1 year ago

Do we have a solution for this issue?