[data grid] How to programmatically expand rows

[shoxter]

The problem in depth

There is currently an example for master detail that shows how to expand/collapse all in a custom header component (here). I want to do the same but for row groupings (expand/collapse all the groupings) but I can't find any selectors that would allow for this or any functions in the API itself as all of the expansion state functions are concerned with master/detail from what I can tell. How can I achieve what I'm looking to do?

Your environment

`npx @mui/envinfo`

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: row grouping selector api
Order ID: 96266

[michelengelen]

You can use the setRowChildrenExpansion on the apiRef for that.

[shoxter]

You can use the setRowChildrenExpansion on the apiRef for that.

For clarity, I think what I was looking for is something similar to the behavior of the recipe for the master/detail expand/collapse all. That being, a way to know what rows are currently collapsed/expanded so I know what type of button I need to display (collapse all vs expand all).

[michelengelen]

you can get the current grouping rows with this:

// on the root level
const groups = apiRef.current.getRowNode<GridGroupNode>(GRID_ROOT_GROUP_ID)!.children;

if you want deeper levels you would need to run this for the respective parent rows.

With this you get the groupIds (rowIds from the grouping rows), with which you can check the current expansion state:

const areSomeRowsExpanded = groups.some((groupId) => apiRef.current.getRowNode<GridGroupNode>(groupId)!.childrenExpanded);

[github-actions]

The issue has been inactive for 7 days and has been automatically closed.

[shoxter]

you can get the current grouping rows with this:

// on the root level
const groups = apiRef.current.getRowNode<GridGroupNode>(GRID_ROOT_GROUP_ID)!.children;

if you want deeper levels you would need to run this for the respective parent rows.

With this you get the groupIds (rowIds from the grouping rows), with which you can check the current expansion state:

const areSomeRowsExpanded = groups.some((groupId) => apiRef.current.getRowNode<GridGroupNode>(groupId)!.childrenExpanded);

This is perfect and the linked example makes perfect sense in light of the specific methods you linked. Sorry for the misunderstanding on my part! Thanks again!

[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

@shoxter How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

[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

@shoxter How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.