Comments (8)
the question still stands though: should we add something like this as a recipe?
It seems to be a quite niche use case, I would wait for upvotes on this first.
from mui-x.
Hey @sanlee13
Is the edit mode triggering the cell/row edit mode?
Or is it a custom state inside the master detail content?
To accomplish this you would need to pass a custom cell renderer to the toggle column and find a way to pass the edit state from your master detail to that toggle renderer.
Could you maybe provide us with a minimal reproduction demo in codesandbox or stackblitz? That would help a lot!
from mui-x.
Hey @michelengelen,
So, when I expand the row, I have button that toggles a custom state that resides in the context data store. When I click the edit, I want to disable the row toggle (expand/collapse).
Here is a sandbox I made: https://codesandbox.io/p/sandbox/quirky-ptolemy-hdlrzd?file=%2Fsrc%2FDemo.js%3A25%2C5
EDIT: Keep an eye on the console
from mui-x.
Hey @sanlee13
Is this what you are trying to achieve?
This is making use of the row model and the apiRef.
from mui-x.
Hey @michelengelen,
Yes, this is precisely what I'm aiming to achieve. Your approach is fascinating and something I wouldn't have considered on my own.
Thank you very much for your assistance.
from mui-x.
Great that this solution works for you.
@cherniavskii should we maybe add this as a recipe to the docs?
from mui-x.
@michelengelen I don't love the idea of mutating row data to reflect the editing state TBH.
Forking GridDetailPanelToggleCell
isn't perfect either.
I forked your demo and made 2 changes:
- used React context for editing state
- reused
GridDetailPanelToggleCell
component
https://codesandbox.io/p/sandbox/silent-frog-tqp59h
What do you think?
from mui-x.
Yes, that's a great solution.
I was thinking of using state or context at first as well, but honestly don't know why i diverted from that. Probably because using state would potentialy lead to unnecessary rerenders 🤷🏼
Thanks for providing that solution ... the question still stands though: should we add something like this as a recipe?
from mui-x.
Related Issues (20)
- [pickers][Datepicker][AdapterDateFnsV3] unable to set single digit day of month format HOT 4
- [charts] LineChart doesn't draw graph on page load HOT 1
- [charts][LineChart] unwanted horizontal line when rendering 100 data points HOT 5
- [data grid] Improve localization dx for custom filters
- [tree view][RichTreeView] Custom styling not working HOT 8
- [data grid] Support edit functionality with server-side data source
- [data grid] GridHeaderCheckbox.js failed to compile x-data-grid after upgrading to v7 HOT 3
- [data grid] Add height property, analog to Chart HOT 1
- [data grid] Upgrade v6 => v7 breaks existing styles applied HOT 1
- [data grid] Replace ExcelJS HOT 1
- [data grid] adding a new row with the autoHeight prop causes first row flicker. HOT 1
- The `column groups` do not appear in the data grid of my Next.js application
- [charts] Missing documentation about how to add tooltip with composition HOT 4
- gridFooterElement is null with hideFooter
- [DateRangeCalendar] Support expanding / collapsing the range using Shift + Arrow keyboards
- [data grid] Group Item With Checkbox Select Children
- [MobileDateTimeRangePicker] Issues combining with `renderTimeViewClock` with 12-hour clock
- [RFC] Highlight scope naming
- A GridFilterOperator with InputComponent set has inconsistent behavior
- [datagrid] Custom aggregation with current column and other column (using params and getCellvalue)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from mui-x.