[Data Grid Web] Group row to calculate grand total of column does not work for auto calculated column
Question
Forge component by OutSystems R&D

Hi,

I am using data grid web component in my application in which I have few auto calculated columns based on other column data. I have added the handler for formatitem in JavaScript to calculate the data - 

 grid.formatItem.addHandler(function (s, e) {
        //
        // cells and column footer panels only
        if (e.panel == s.cells) {
            //
            // get row, column, and data item (or group description)
            var r = s.rows[e.row];
            var c = s.columns[e.col];
            var item = s.rows[e.row].dataItem;
            var group = r instanceof wijmo.grid.GroupRow ? item : null;
      
            // assume value is not negative
            var negative = false;
            //
            // calculate Outstanding
            if (c.binding == 'Outstanding') {
               var outstandingGroup = group ? group.getAggregate('Sum', 'Incurred') - group.getAggregate('Sum', 'Paid')
                    : item.Incurred - item.Paid;
                var outstandingGroup = isNaN(outstandingGroup)?0:outstandingGroup;
                e.cell.textContent = wijmo.Globalize.format(outstandingGroup, c.format);
               
            
                }
                negative = outstandingGroup < 0;
            }  
            });

also added the row at the end of the grid to calculate the grand total for the columns.

var addSumRow = function(gridId){
        var gObj = GridOS.ComponentUtils.getGridObjectById(gridId);
        var grid = gObj.grid;
        grid.columnFooters.rows.push(new wijmo.grid.GroupRow());
        grid.bottomLeftCells.setCellData(0, 0, 'Total');
    };

But this doesn't work for the calculated columns, and the total for that column doesn't get updated.

Please suggest how can we get that total of the calculated column.


Thanks,

Unnati

Hi Unnati,


Can you please send us a sample with your custom code, so we can investigate?


Thank you,

Gabriel Lundgren

Hi Gabriel,

I have attached the .oap file for sample.

In this the "Column3" is auto calculated column i.e. addition of "Column1" and "Column2". I have added the script on the Page JavaScript property and in preparation I have used the run JavaScript action to execute those java scripts.

Also the Columns are editable so that you can add data and check.

Below is the URL through which you can access the sample application - 

https://unnati-khanorkar.outsystemscloud.com/DataGridIssue/Entry1.aspx

The Group row for "Column3" doesn't show the grand total  like for "Column1" and "Column2".

Let me know if you need anything else.


Thanks,

Unnati.

DataGridIssue.oap

Hi Unnati,


Thank you for sending the sample. 

Since you are extending OS Grid capabilities,  we can't really help you. Our investigation showed that this is not available in the wijmo Grid. You can find further information on wijmo's forum or their documentation.


Thank you,

Gabriel Lundgren

Hi Gabriel,

Thank you for your reply. I will go through the wijmo forum and documentation again.
Other than that if you could suggest any solution to get the requirement fulfilled that will be helpful.

Thanks,

Unnati.

Hi Gabriel,

I had figured out one solution by using "setCellData" function of Wijmo apis. But after using this the Column1 and Column2 cells are flickering a lot that I can not add data into it.

Adding the script below- 

 
            if (c.binding == 'Column3') {
               var column3Data = group ? group.getAggregate('Sum', 'Column1') + group.getAggregate('Sum', 'Column2')
                    : item.Column1 + item.Column2;
                var column3Data = isNaN(column3Data)?0:column3Data;
               e.cell.textContent = wijmo.Globalize.format(column3Data, c.format);
               e.cell.innerHTML = wijmo.Globalize.format(column3Data, c.format);
       
               e.panel.setCellData(e.row,e.col,wijmo.Globalize.format(column3Data, c.format));
              s.invalidate();
              
                negative = column3Data < 0;
            }  

You can again refer the same URL for checking the issue - 

https://unnati-khanorkar.outsystemscloud.com/DataGridIssue/Entry1.aspx 

Please let me know if you can help in this.

Thanks,

Unnati

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.