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/
4.08k stars 1.26k forks source link

[data grid] Editing row from example code not working #14214

Closed teddis closed 1 month ago

teddis commented 1 month ago

wraplinks.tsx.zip

The problem in depth

I have built a more complex page component to display a data grid pro. I incorporated your sample code from https://mui.com/x/react-data-grid/editing/#full-featured-crud. The trash/delete functionality works. But the edit/cancel is not triggering edit of the row and focusing on the editable fields. I'm at a loss, and spending too much time debugging without enough documentation to help make sense of what's going on.

Your environment

System: OS: macOS 14.5 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: Chrome: 127.0.6533.101 Edge: Not Found Safari: 17.5 npmPackages: @mui/private-theming: 5.16.4 @mui/styled-engine: 5.16.4 @mui/system: ^5.16.4 => 5.16.4 @mui/utils: ^5.16.4 => 5.16.4

Search keywords: editing row Order ID: 91768

michelengelen commented 1 month ago

Hey @teddis For security reasons we are not using downloads, but instead live code editors (like codesandbox or stackblitz). Could you please run the code you are struggling with in either one? You can also use the templates from our docs as a starting point. For convenience we provide pre-built demos that you can fork and share with us:

Screenshot 2024-08-15 at 11 11 31
github-actions[bot] commented 1 month ago

The issue has been inactive for 7 days and has been automatically closed.