Questions tagged [mui-x-data-grid]
170 questions
0
votes
0 answers
MUI - Premium Data Grid toolbar icons are not appearing properly
I want to do three things -
Correct the display
Putting custom icons for the toolbar item
Add a custom toolbar option.
This is how I am using Datagrid.
p zankat
- 75
- 2
- 14
0
votes
1 answer
How can I prevent a value from being rendered in the group header when using renderCell on a column in Material UI’s DataGrid?
codesandbox replicating this issue: https://codesandbox.io/s/stupefied-gagarin-jgcnfl?file=/demo.tsx:563-672
relevant piece of code that renders this contrived example of 'asdf' for the Id row.:
{
field: "id",
headerName: "ID",
width: 100,
…
Embedded_Mugs
- 2,132
- 3
- 21
- 33
0
votes
1 answer
When I try to use useKeepGroupedColumnsHidden in MUI's DataGrid, it is throwing the error props.apiRef.current.subscribeEvent is not a function
When I add the following code snippet to my react component:
const apiRef = useGridApiRef();
const initialState = useKeepGroupedColumnsHidden({
apiRef,
initialState: {
rowGrouping: {
model: ['datetime'],
},
},
…
Embedded_Mugs
- 2,132
- 3
- 21
- 33
0
votes
0 answers
MUI X - Custom cell filtering
Is it possible with mui x component (free, pro or premium version), to have custom filtering not by columns, but per cell values, same or similar how wijmo behave.
BR,
Игор Ташевски
- 474
- 1
- 6
- 13
0
votes
1 answer
DataGrids suddenly stretched their parents to fit them in full capacity without the horizontal scrollbar
I initially thought that I had broken something, but after performing multiple tests on simpler models, I now realize that it is not me, but MUI v6 that has, in fact, changed something about the display of DataGrids Pro that include columns with a…
AdamJJ
- 1
- 1
0
votes
0 answers
How to enable row reordering when row is in edit mode MUI Data Grid
When using using rowReordering prop, reordering works well, but when the row enters edit mode the reordering icon is disabled. How can I still drag the row while the row is in edit mode?
I am using Data Grid Pro version 5.15.3.
Lanet
- 185
- 2
- 7
0
votes
1 answer
Hide Checkbox Column in MUI X DataGrid while printing
I have an MUI X DataGrid with some columns including checkbox column, when I print the table, the checkbox column will also be printed. Is there any way to hide it only when the user wants to print the table?
Screenshot of the table in printing…
Abulrahman
- 25
- 6
0
votes
1 answer
MUI X data grid apiRef methods are not found even with version 6 installed
I've been attempting to create some data tables for an app that I am building, and I am utilizing Material UI's data grids. So far, they have been working well, and I have been aware of the features that are blocked in the community version and…
Sean Barton
- 1
- 1
0
votes
0 answers
MUI Data Grid Pro : Parent row with a collapsible child panel and show one specific row expanded by default
I am using MUI Data grid pro to render parent row with collapsible child table. When the table is initially rendered all the parent rows are collapsed with a "+" button.
On clicking the "+" child table is rendered and this is working fine. However I…
Kavitha
- 11
- 1
0
votes
0 answers
After applying Amplify AUTH, the style of MUI components is broken
I'm facing following issues while integrating Amplify auth in an existing React application,
"Row per page" on the grid is not showing vertically, they are lined up horizontally. MUI x-data-grid-pro 5.17.22 is being used.
Rows per page in grid
The…
Young
- 1
0
votes
1 answer
How to change MUI datagrid display mode for mobile viewport
I'm using MUI datagrid (community edition, v.5.17.22) in my react project (v.18.2.0).
I want to change how datagrid renders rows and columns when using the application on mobile devices. I don't know how to describe it better, so I attached two…
Zohreh Khaghani
- 16
- 3
0
votes
1 answer
Mui Datagrid columns panel make show all button disabled if all filters selected
In datagrid columns panel I want to disable show all button if all filters checked. I checked button classes for Mui-disabled to handle it from css but there is not. How can I disable it?
user11482333
0
votes
5 answers
How to change background color of all elements before the element I clicked in a grid
I want to achieve something like this, when I click on 20 numbered block, everything before that changes to light orange.
I have this attached sandbox code, if anyone can guide what to add in the handleClick function would be…
Ishaan Kanwar
- 399
- 1
- 4
- 16
0
votes
0 answers
How to apply MUI DataGrid quickFilter on custom renderCell
I use "@mui/x-data-grid": "5.17.26"
My simplified code:
const columns = [
{
field: "testname",
headerName: "Name",
renderCell: (params) => {
return params.row.testcase.name;
},
},
//...
];
//...
Liang HE
- 73
- 5
0
votes
1 answer
How to change Mui DataGrid Toolbar label and input placeholder text?
I am currently using React MUI. I added toolbar button to my datagrid. In toolbar panel there is default "Find column" label and "Column title" input placeholder values. How can I change/replace those values?
I tried in sx prop giving to label…
user11482333