Row grouping: having row group children in same page as parent group when pagination is active

Question

I am implementing row grouping in React with ag-grid. I have the enterprise edition and I am using server-side as the rowModelType. I have enabled pagination (let's say, to 5 rows per page). When I first see the table I have the first parent row groups on the screen:

When I expand the first parent group (Austria), which has 70 children, I would like the children not to be cut off from the same page, but instead to show the children and the other 4 countries in the same page. I am getting this instead:

Here is the example in Plunker:

{https://plnkr.co/edit/2bn1OsgrpIKGcLgDJHIt?p=preview}

Is there a way to keep page size in 5 rows, but that only the parent groups are counted as items and not the children? The final aim is to see the children in the same page as the parent group, in case there is an alternative solution without specifically grouping them in the columns defs.

Thanks in advance!

Answer 1

I suppose you are a little bit wrong in understanding of how the pagination and grouping works.

Grouping provides a possibility to organize data in a better way for user understanding, same for Pagination, it has one level of the layer.

You want to have complex logic to handle parent and child data with pagination separately. So you need to use Master/Detail feature for splitting the logic and have own pagination for each layer.