Questions tagged [mui-x-data-grid]
170 questions
0
votes
0 answers
How to print Mui data-grid with image inside renderCell
I'm using Mui data-grid to show data using renderCell. I want to print my data-grid and see the picture from the first renderCell.
const columns: GridColDef[] = [
{
field: 'picture',
headerName: 'Picture',
flex: 1,
…
hansly
- 1
- 3
0
votes
1 answer
Mui Datagrid height exceeds parents div when the rows are "more" than the height after MUI Datagrid 6
So in mui grid 5 this worked nicely. The grid should overflow in itself and create a scroolbar. Now its makes the window scroll and grow it.
Why?
Hodl
- 41
- 2
- 9
0
votes
0 answers
React.useRef: uncaught TypeError: Cannot assign to read only property 'current'
I am currently working on refactoring a project which wraps around the MUI DataGrid component to use the API object.
To this end, I am trying to implement my own API object implementation in order to expose methods for interacting with a component.…
jamerst
- 65
- 1
- 7
0
votes
0 answers
How to Display DropDown component inside a Material UI datagrid with nested data?
I am using DataGrid from "@mui/x-data-grid"
I want to display and the edit a field 'Region' as a DropDown (Select) with (Value: id, and Text: regionName) which is a nested JSON object.
The user will select from the dropdown menu.
The original JSON…
Technology 2023
- 25
- 1
- 4
0
votes
1 answer
How to Memoized material ui Datagrid in React
I can't memoized my Material UI Datagridtable in React
const Mockdata = [{id: 1 , user: "john",School: "LAL" },
{id: 2 , user: "Ruby",School: "LAL" }]
const column = [
{ field: "user", headerName: "Username", width: 250 },
{ field: "School",…
Inno Namsu
- 1
- 1
0
votes
0 answers
Why is the last column in MUI DataGrid not showing?
I'm using MUI DataGrid and these are the columns :
const columns = [
{
field: "taxon",
headerName: "Taxon",
flex: 1,
minWidth: 300,
renderCell: (params) => {
const index = inputLines.findIndex((line)…
HICHEM NEGGAZ
- 9
- 3
0
votes
1 answer
MUI Datagrid open column filter directly from button in header
Is there a way to force filter button to always be visible in each column header no matter if filter is applied or not.
I tried doing it from sx prop like this
Oleksandr Fomin
- 2,005
- 5
- 25
- 47
0
votes
0 answers
"onCellEditCommit" prop is not working in Mui-DataGrid
I am trying to edit data in the Mui DataGrid cell and updating the data in the backend server as well on commit. But no way the prop is calling the "handleCellEditCommit" function. Here is the code,
const ODclientList = () => {
const theme =…
0
votes
0 answers
How can I optimize publishing react component as a node module?
I have developed and published a node module which is a React component.
Here are its links.
https://www.npmjs.com/package/mui-datagrid-full-edit
https://github.com/prettyblueberry/mui-datagrid-full-edit
Of course, the module works well, but it has…
Blueberry
- 1
- 1
0
votes
0 answers
How to get rows exactly like they are displayed in react mui datagrid? (filtered and sorted in the same way?)
Im making selected row move up and down on arrow clicks and for that I need to get rows from mui datagrid preferably using useGridApiRef hook. It's crucial that rows are filtered and sorted so they match what's visible in dataagrid.
I got to the…
0
votes
0 answers
How to render nested values of same parent in MUI datagrid column?
This is the data that I want to display in the datagrid.
[
{
"state": "UP",
"prominentCities": {
"capital": "Lucknow",
"LargestCity": "Noida"
}
},
{
"state": "Gujarat",
"prominentCities": {
"capital":…
p zankat
- 75
- 2
- 14
0
votes
0 answers
MUI Datagrid - Is there any way to change the grid toolbar ttext?
I am using Datagrid with React.
Is there any way to change the tool text?
The code where I am trying is here in the sandbox.
p zankat
- 75
- 2
- 14
0
votes
0 answers
DataGridPro table slots
I have a table:
and now I need to make drawer in this table:
I tried to use dataGrid slots, like toolbar on screenshot, but I never found the slot I needed? (drawer should not overlap the content of the table, it should shift it.)
I…
MgttrN
- 1
- 1
0
votes
0 answers
How do I change the buttons in Manage Columns?
I need to turn off the fullwidth of the buttons and change variant ('primary', 'secondary') in the DataGrid.
How do I do it through slotProps? Screen
I searched for information in the documentation, but found no information
Alexander
- 1
- 1
0
votes
0 answers
How to change the ordering of columns in MUI's DataGrid when row grouping is enabled?
As you can see in this code sandbox, the "Company" column comes third in the column config array but appears visually as the first one in the table. This is because the row grouping automatically makes the groupable column the first column.
This MUI…
Embedded_Mugs
- 2,132
- 3
- 21
- 33