Pagination of subrows in a grouped model

[florianbepunkt]

Hi, I'm using the grouping api to simply categorize rows by only one column - like the first name letters as sub headers in an address book.

table.getRowModel().rows.map((row) => {
// shortened for brevity
row.subRows.map((subrow) => (
// shortened for brevity
)
})

What I would like to achieve is to use the built in pagination api, to only show 10 rows per page, regardless whether they are rows or subrows. But currently, pagination only works for the depth-0 rows. It would render hundreds of rows on the same page, if they belong to the same group.

So how can I use the pagination api together with the group api?

EDIT: Basically I would like something like paginateExpandedRows but for subrows

[ladderschool]

Did you ever figure this out? I've come across this limitation and it's a little annoying.

[florianbepunkt]

No, unfortunately not. If you find a solution, it would be great if you can share it.

[lucien-theron]

+1 I would also like this. We need pagination in subrows/panel. We have a workaround by building a table in the detail panel ourselves and adding pagination but its not ideal. For example, aligning columns with the parent is a bit messy.

[barry166]

You can't get that exact behavior from the built-in pagination row model today.

The pagination stage slices the current top-level row model. Group rows are still rows, and their expanded subRows are attached under those rows. paginateExpandedRows: false only changes whether expanded children stay on the same page as their parent; it does not flatten group headers + children and then paginate that flat visual list.

So the practical options are:

// group headers count toward pageSize; expanded children stay with parent
paginateExpandedRows: false

or build the rendered list yourself from table.getPrePaginationRowModel() / getRowModel(), flatten the visible group rows + subRows, slice that array to 10 visual rows, and render from the sliced list. If each group/detail panel needs its own independent pagination, a nested table (your current workaround) is still the cleanest supported shape.