[data grid] Row grouping not working

[danieltaoxu]

The problem in depth

Hello,

I'm using your Premium license, and I'm creating a DataGridPremium in React JS with row grouping, with my data, not using your moviedata, it's not working, after grouping the rows , only the grouped column appears but not others, neither for the data values, Do I missing something ?

Here is an example of my data and columns :

const columns = [
  { field: 'id', headerName: 'id', width: '120' },
  { field: 'acc', headerName: 'Acc', width: '200' },
  { field: 'accdescription', headerName: 'Descrition', width: '300' },
  { field: 'cliacc', headerName: 'CliAcc', width: '200' },
  {
    field: 'amount',
    headerName: 'Amount',
    width: '200',
    renderCell: (params) => formatNumber(params.value),
    groupable: true,
  },
];

const rows = [
  {
    acc: 'A20',
    amount: '2055.18968',
    cliacc: '2053',
    initamount: '7954.0',
    accdescription: 'descr1',
    id: 0,
  },
  {
    acc: 'A20',
    amount: '14.91354',
    cliacc: '2052',
    initamount: '7954.0',
    accdescription: 'descri2',
    id: 2,
  },
  {
    acc: 'A27',
    amount: '166.51',
    cliacc: '2070',
    initamount: '2084.0',
    accdescription: 'descri3',
    id: 3,
  },
  {
    acc: 'A27',
    amount: '1618.0',
    cliacc: '2071',
    initamount: '2084.0',
    accdescription: 'descri4',
    id: 4,
  },
];

Could you help please ?

Best

Daniel

Your environment

`npx @mui/envinfo`

  System:
    OS: macOS 14.3
  Binaries:
    Node: 22.5.1 - /opt/homebrew/bin/node
    npm: 10.8.2 - /opt/homebrew/bin/npm
    pnpm: Not Found
  Browsers:
    Chrome: 128.0.6613.138
    Edge: Not Found
    Safari: 17.3
  npmPackages:
    @emotion/react: ^11.11.1 => 11.13.3 
    @emotion/styled: ^11.11.0 => 11.13.0 
    @mui/base:  5.0.0-beta.40 
    @mui/core-downloads-tracker:  5.16.7 
    @mui/icons-material: ^5.15.1 => 5.16.7 
    @mui/material: ^5.15.14 => 5.16.7 
    @mui/private-theming:  5.16.6 
    @mui/styled-engine:  5.16.6 
    @mui/system:  5.16.7 
    @mui/types:  7.2.16 
    @mui/utils:  5.16.6 
    @mui/x-charts: ^6.19.5 => 6.19.8 
    @mui/x-data-grid:  7.16.0 
    @mui/x-data-grid-generator: ^7.16.0 => 7.16.0 
    @mui/x-data-grid-premium: ^7.16.0 => 7.16.0 
    @mui/x-data-grid-pro:  7.16.0 
    @mui/x-internals:  7.16.0 
    @mui/x-license: ^7.16.0 => 7.16.0 
    @types/react:  18.3.5 
    react: ^17.0.2 => 17.0.2 
    react-dom: ^17.0.2 => 17.0.2 
    typescript:  4.9.5 

Search keywords: Data Grid - Row grouping not working
Order ID: 98056

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

We value your feedback @danieltaoxu! How was your experience with our support team?
If you could spare a moment, we'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!

[danieltaoxu]

never mind , I found the cause