Despite the COVID-19 outbreak, our team continues operating at full speed. We are always here to support and answer all your questions.

Feel free to reach out by filling this quick form.

Fill the form
Get Free Trial

Adding totals in flat form with a caption?

Answered
Abhilash asked on March 5, 2021

Hi,
Is it possible to add totals for selected columns with a caption total beside it in flat view? Attached requirement

11 answers

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster March 9, 2021

Hello,
 
Thank you for reaching out to us.
 
We suggest using the customizeCell hook to customize the cells of the table. It can be used to complement the grid with a “Total” cell. The following code snippet serves as an example:

flexmonster.customizeCell((cell, data) => {
  if (isNaN(data.value)) {
    let nextCell = flexmonster.getCell(data.rowIndex, data.columnIndex + 1);
    if (nextCell && nextCell.isTotal) {
      cell.text = "Total:"
    }
  }
});

 
It will set the cell’s caption to be “Total:” in case its current value is NaN, and its right neighbor is the grand total.
 
You are welcome to see the JSFiddle demonstrating this approach: https://jsfiddle.net/flexmonster/2qLht4v5/.
Please note that it is prepared only for the demonstration and may need to be changed to match your specific use case.
 
Please let us know if it works well for you.
 
Kind regards,
Illia

Public
Abhilash March 9, 2021

Awesome! thank you very much. But i see an issue if it’s on the top it’s kind of fixed and doesn’t scroll with the data which is nice so user can see it all the time. But if it’s at the bottom i cannot see that until i scroll to the bottom of the page. Any workaround?
https://jsfiddle.net/9z0kw8Lc/

Public
Mykhailo Halaida Mykhailo Halaida Flexmonster March 10, 2021

Hi Abhilash,
 
Thank you for your quick response.
 
At the moment, Flexmonster does not allow sticking the bottom-situated grand totals, similarly to how it works with the top position.
 
Please let us know if there is anything else we can help you with.
 
Best regards,
Mykhailo

Public
Abhilash March 10, 2021

No problem. Thank you!

Public
Abhilash March 15, 2021

Hi,
Is it possible to add this function while saving the report. Like after saving the report we are building flexmonster on the nodejs and running the report to download. So it’s missing this totals text. Is it possible to include this totals text in the report format when we save it? like in conditional formatting or something with this
https://www.flexmonster.com/api/addcondition/

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster March 16, 2021

Hello,
 
Thank you for your question.
 
You are right about the fact that all the changes applied through the customizeCell function will not be included in the report.
As a workaround, we recommend specifying the corresponding custumizeCell function in the environment where these saved reports will be opened. In this case, all the changes will be applied as expected.
For example, you can define the customizeCell function while creating the Flexmonster instance. This approach is demonstrated in the following JSFiddle: https://jsfiddle.net/flexmonster/qmLkca70/. Now any report opened with this instance will be customized according to the specified function.
 
Please let us know if it works for you.
 
Kind regards,
Illia

Public
Abhilash March 18, 2021

Thank you! I have another issue so when i drag the columns and rearrange them. the totals text is little messed up it’s like displaying multiple times. Try dragging price column to second column in the jsfiddle example you gave me. Any work around for this?
 
https://jsfiddle.net/flexmonster/2qLht4v5/.

Attachments:
column dragging.PNG

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster March 19, 2021

Hello,
 
Thank you for your feedback.
 
We would like to confirm that the current solution adds “Total” on any empty cell before the grand total.
You are welcome to modify the used condition to adjust the behavior.
 
For example, we have complemented the example so that only the most left grand total will be preceded by the “Total” caption: https://jsfiddle.net/flexmonster/2qLht4v5/.
 
Further behavior adjustments depend on the desired behavior of this feature.
 
Please let us know if it helps.
We are looking forward to hearing from you.
 
Kind regards,
Illia

Public
Abhilash March 19, 2021

Thank you

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster March 24, 2021

Hello,
 
We are reaching out to ask if the proposed solution works well for you.
 
Our team is looking forward to hearing your feedback.
 
Kind regards,
Illia

Public
Illia Yatsyshyn Illia Yatsyshyn Flexmonster April 7, 2021

Hello,
 
We are curious if our latest example fits your needs.
 
Feel free to reach out in case further questions appear.
 
Best regards,
Illia

Please login or Register to Submit Answer