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!
When a DataGrid is grouped by a column, by default the grouping row uses the custom cell renderer. I know its possible to override this behaviour by using renderCell and doing:
renderCell: ({ row: { field }, rowNode }) => {
if (rowNode.type === 'group') {
return field;
}
But this becomes tedious because in my case we have several tables that are 30+ columns that all have a valueFormatter.
Is there a property on the column or the Datagird where I can specify that the column for the grouping row can ignore the valueFormatter/ renderCell?
The problem in depth
When a DataGrid is grouped by a column, by default the grouping row uses the custom cell renderer. I know its possible to override this behaviour by using
renderCell
and doing:But this becomes tedious because in my case we have several tables that are 30+ columns that all have a
valueFormatter
.Is there a property on the column or the Datagird where I can specify that the column for the grouping row can ignore the valueFormatter/ renderCell?
example where every column has valueFormatter and its a pain to have to override the grouping renderer: https://stackblitz.com/edit/react-ch8hus?file=Demo.tsx
Your environment
Search keywords: row grouping default column value Order ID: 72840