v8 - Show Aggregated Value in a Grouped Cell (cell.getIsGrouped() === true) #4098
Unanswered
treasurely
asked this question in
Q&A
Replies: 1 comment 1 reply
-
Have you compare it to the normal grouping example? I believe it does this
…On Jul 4, 2022, 9:17 PM -0600, adamshater ***@***.***>, wrote:
I've been trying to replicate this v7 "Grouping Column" example in v8 : https://react-table-v7.tanstack.com/docs/examples/grouping-column
Essentially, when a column's groupBy status is toggled to true, all columns should remain in place (including the toggled one). The separate "grouping" column displays the grouping value, and all other cells for the grouped row should be empty, unless the column has an aggregate function (same functionality as something like AG Grid or Airtable for those familiar).
Everything is working in the v8 table with the exception of rendering the aggregate value for a column that the table is currently grouped by -- it will always show the value of the first leaf row instead of the aggregate function. In the sandbox below, I'd expect "count" values to show up in both "Studio" and "Year" -- when the table is grouped by both, the aggregate value doesn't show up. When removing "year" (there's a button to toggle it easily in the sandbox), the aggregate value then shows up. I've tried a few different ternary renders -- currently I'm using:
{row.getIsGrouped() ? flexRender( cell.column.columnDef.aggregatedCell ?? null, cell.getContext() ) : flexRender( cell.column.columnDef.cell, cell.getContext() )}
Sandbox here: https://codesandbox.io/s/distracted-haze-lq9ojm?file=/src/App.js
If we can get an answer to this, happy to build something for the v8 examples page that creates a "Grouping with Group Column" table -- also helpful for people building an Airtable-type or AG Grid-type clone.
Thanks!
—
Reply to this email directly, view it on GitHub, or unsubscribe.
You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>
|
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
I've been trying to replicate this v7 "Grouping Column" example in v8 : https://react-table-v7.tanstack.com/docs/examples/grouping-column
Essentially, when a column's groupBy status is toggled to true, all columns should remain in place (including the toggled one). The separate "grouping" column displays the grouping value, and all other cells for the grouped row should be empty, unless the column has an aggregate function (same functionality as something like AG Grid or Airtable for those familiar).
Everything is working in the v8 table with the exception of rendering the aggregate value for a column that the table is currently grouped by -- it will always show the value of the first leaf row instead of the aggregate function. In the sandbox below, I'd expect "count" values to show up in both "Studio" and "Year" -- when the table is grouped by both, the aggregate value doesn't show up. When removing "year" (there's a button to toggle it easily in the sandbox), the aggregate value then shows up. I've tried a few different ternary renders -- currently I'm using:
{row.getIsGrouped() ? flexRender( cell.column.columnDef.aggregatedCell ?? null, cell.getContext() ) : flexRender( cell.column.columnDef.cell, cell.getContext() )}
Sandbox here: https://codesandbox.io/s/distracted-haze-lq9ojm?file=/src/App.js
If we can get an answer to this, happy to build something for the v8 examples page that creates a "Grouping with Group Column" table -- also helpful for people building an Airtable-type or AG Grid-type clone.
Thanks!
Beta Was this translation helpful? Give feedback.
All reactions