How to add aggregation to grouped columns (like sum, avg, count) ?

[volkanakbas]

• [x] I have searched this repository's issues and believe that this is not a duplicate.

Current Behaviour

Hi, We are evaluating this table component and couldn't find a way to add aggregation to grouped column?

Expected Behaviour

Be able to set aggregate function to a column? For instance, if you have Country State City Amount columns in your data set, you group by Country and you have set the option for Amount column to be summed up when grouped by any column. When table is grouped by any column, it should show "Sum(amount)" as subtotals. Here is an example https://js.devexpress.com/Demos/WidgetsGallery/Demo/DataGrid/GroupSummaries/jQuery/Light/

[gsobolev]

Hi, You can achieve the required behavior by implementing a custom Grid plugin. Please check the following example demonstrating the basics of such plugin implementation.

[carab]

Hello @gsobolev,

I have a similar case where I'd like to display the number of rows concerned by the group. In your example I found that I can access those rows from params.tableRow.row.collapsedRows, but once the group is opened, collapsedRows is no more available and I can't seem to find how to get these.

Do you have an idea on how to do this ? collapsedRows should always be present ?

Thank you !

[gsobolev]

Hi @carab,   The collapsedRows property is available only for collapsed groups by design. It is a bit tricky to get both expanded and collapsed rows of a group, so I have created an example demonstrating how this can be achieved. Please find it here.

[carab]

Wow thanks for the example @gsobolev ! I see what you did and it is indeed a bit tricky, but it does the job ^^

Isn't it possible to simply always include the rows in tableRow.row ? You say its because of the design that collapsedRows is not available when the group is opened, does it mean the design can't be easily changed ?

Thanks again for your help !

[gsobolev]

No, the design cannot be changed easily due to internal reasons. Anyway, we will consider your feedback in the future. Thank you for reaching out to us!

[carab]

Alright I understand ;)

Thanks again for your help !

[volkanakbas]

Is there anyway you can think of adding aggregates differently for each column? Example, I have 3 columns and want to implement avg, sum, count for each one respectively. I would like to set the aggregate function while creating the columns configuration. Any idea how to go about adding this feature?

[jasper-lu]

I currently have aggregation working here to display averages for columns in the group now. Is there a way for me to change what is exported in <Template name="root"> in the rows parameter? Right now, my data has 10 entries. When I add aggregation, there are 2 groups, so 12 rows get exported. 2 rows are of the format:

{
  groupedBy: <>
  key: <>
  ...
}

I want to add the aggregated column values to the row that is exported here. Is there a way I can do that?

I need this because I would like to access the aggregated value from a different section of the code, rather than reperforming aggregation elsewhere. Let me know if there is anything confusing. I can create a new thread as well.

[gsobolev]

Hi @jasper-lu,

You can define a Getter and override the rows parameter value:

<Getter
  name="rows"
  computed={rowsWithAggregatedData}
/>

[jasper-lu]

Thanks!

[Daemon-Knoppix]

Hi @gsobolev,

I tried your example for showing inner row count on grouped row (stated above in this comment, example url).

When i try to use the same code with latest devextreme-reactive packages of version 1.4.0 the code now does not show count only shows 0. If i open all collapsed rows it then shows count of Inner Rows. updated example url.

I can see that while using latest version 1.4.0 object params.tableRow.row does not contain key collapsedRows.

Can you provide any solution for the newer version of Grid? Also, is this feature still a workaround or implemented in new releases?

[gsobolev]

Hi @Daemon-Knoppix,

The provided solution is based on an internal API which has been changed. I have modified your example according to the updated API. Please find it here.

[devluist]

sorry to bother, but again the example is broken in v1.9 could you help me out... I love the way it's so easy to import a component and that thing does all the heavy lifting... but when I need custom behaviour... I get lost in the api docs...

As I see, I need a function param to count the rows (getCollapsedRows)... but according to chrome-debugger it never entered the TemplateConnector... and there I get lost xD

I don't know how to pass the function or how to call it or where...

[MaximKudriavtsev]

@desLT

I updated the example. Also, you can use our built-in Summary.

[devluist]

thank you @MaximKudriavtsev, that was fast! :D

Yeah I was playing with the summary plugin. but the thing is that it only appears when you open the group row and in the end of each group... I was trying to place it at top.. and maybe make some css magic to place it at the same level as the grouprow...

What I need it's that it always be visible at a glance, even when closed... or there is a custom summary option for it that I missed?

[fabiandeny]

Hi, I've seen the example in here But when I tried switching it to @devexpress/dx-react-grid-bootstrap4 as in here, I got error. Is there a way I can use it with the bootstrap4 version?

Thanks

[MaximKudriavtsev]

Hi @fabiandeny,

You should install the required dependencies followed Getting Started guide. The updated example.

[fabiandeny]

Thanks a lot @MaximKudriavtsev Got it working now

[lock[bot]]

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests.