Grand Total in the table with pagination

Question

I have a problem with Pentaho CDE. I would like to add a row to the table component with a total of numeric column, but the code, that I found, works only with one page of the table. When I set Pagination on True, the Total is calculated only for the first page. I want to reach a value for all of the rows without dependence on the number of page.

Here's the code:

function f() {
    var grandTotalRow = "<tfoot><tr><td>Suma</td>";

  for(i=1;i<2;i++) {
        var total=0;
         var rows = $('#' + this.htmlObject + ' tbody tr');

          rows.each(function() {
            var cellVal = parseFloat($('td:eq('+i+')', this).text().replace(',',''));

          if(!isNaN(cellVal)){
              total+=cellVal;
          }

           });
        grandTotalRow += "<td>"+total.toFixed(0);+"</td>";
        }
          grandTotalRow += "</tr></tfoot>";
          if($('#'+this.htmlObject+' tfoot').length===0)
        $('#'+this.htmlObject).find('table').append(grandTotalRow);

    }  

(source: http://biwithui.blogspot.com/2014/06/grand-total-in-table-component.html )

I would be grateful for all of the advices!

Answer 1

Another way to handle totals in the table component is to add a total row to the resultset in the PostFetch function. But the totals will only be visible on the last page and sorting should be inactive with this method.

function f(d) {
 d.queryInfo.totalRows = d.resultset.length+1 + "";
 var total = new Array("Total",0,0,0,0,0,0,0,0," ");
 d.resultset.forEach(function (row){
    row.forEach(function (c,i){
        if (i!==0 && i!==9){
            total[i] = total[i]+c;
        }
    });
 });
 d.resultset.push(total);
 return d;
} 

You can format this total row in the PostExecution function by applying a CSS class to the last row.

function f() {
  if ($('#'+this.htmlObject+'Table tr:last td:first-child').text() == 'Total') {
    $('#'+this.htmlObject+'Table tr:last').attr("class","tableTot");
  }
}