Get Free Trial

How to group columns

Vazgen asked on November 24, 2020

We need to group columns in a way presented in the attached Excel file. 
Thank you,


5 answers

Vera Didenko Vera Didenko Flexmonster November 24, 2020

Hello, Vazgen,
Thank you for writing to us. 
According to the attached Excel file, it seems that the classic layout option will do the trick.
To enable classic layout by default, set the grid "type" option to "classic", for example:

options: {
grid: {
type: "classic"

Here is a JSFiddle for illustration:
Please kindly note that there should be enough space for frozen cells and data; otherwise, the component will automatically switch to compact layout.
For more information about the available configuration options, please see the following guide.
Please let us know if this helps. 
Looking forward to your reply.
Kind regards, 

Vazgen November 30, 2020

Hello Vera, 
Thank you for answer.
In my attached file we have a fixed collapsed columns (last one) , that must be expanded and open another columns . I must have fixed hierarchical columns based by implemented header .

Vera Didenko Vera Didenko Flexmonster December 1, 2020

Hello, Vazgen,
Thank you for your response.
If we understand correctly, you would like the fixed columns to be collapsed by default.
If this is the case, we would like to confirm that this is possible.
In the example that we provided earlier, the expandAll: true setting was added to the report configuration to make the columns expanded by default.
If this setting is removed, the columns will be collapsed. 
Here is a modified version of the provided example where columns are collapsed:
Please let us know if this helps. 
Looking forward to your reply.
Kind regards, 

Vazgen December 3, 2020

Hello, Vera,
Thank you for your response.

In your example expandable data , not headers .
In my case the generated report has for instance three columns with numbers (e.g. integers): A, B, C, D, E, F
It is required to have subtotal and total for that columns in the form:

  • 1st Subtotal = A+B+C
  • 2nd Subtotal=D+E+F
  • Total = 1st Subtotal + 2nd Subtotal

Above mentioned columns should appear accordingly

  • 1st subtotal after C column
  • 2nd subtotal after F column
  • Total after 2nd subtotal

By default all the columns A, B, C, D, E, F, subtotals and total should be visible on the report. But on click on any subtotal header the connect data columns should be hidden (for example on click 1st Subtotal the A,B,C columns should be hidden). And on click on Total header, all the columns should be hidden.
On second click to the same Total the Subtotal header should become visible. Further on click on Subtotal header the data columns should appear.

Mykhailo Halaida Mykhailo Halaida Flexmonster December 7, 2020

Hi Vazgen,
Thank you for the explanation of your use case.
Our team has taken a look at your sample once again while also considering the description you’ve provided in your latest response.
That being said, while the described behavior is not something Flexmonster usually deals with, you could probably achieve something close with additional pivot table customization.
For example, you can use calculated values to imitate the subtotal columns you’re referring to – define the formulas in a way that the newly created measures represent the sums of underlying columns. After this, the customizeCell() API call can be used to add click handlers to the subtotal cells – once they are clicked, the pivot table slice can be modified accordingly to imitate collapsing/expanding.
Please let us know if you find the suggestion above helpful.
We were also wondering if you could tell us a little more about the view you are trying to achieve. More specifically, should this be a pivot view, or more of a flat layout (CSV-like structure)? 
Thank you in advance – we are looking forward to your response.

Please login or Register to Submit Answer