get sum of all columns at tfooter

get sum of all columns at tfooter

edited February 2012 in General Posts: 6
hello all,

i am trying to get the sum of each column, how should i do that ?

i have used a table on more then 12 pages, and defined at first home page which is included at all pages,
here is code with i want to show the sum of each column


//"bJQueryUI": true,
"sScrollX": "110%",
"bScrollCollapse": true,
"iDisplayLength": 10,
////// add more show per page list "aLengthMenu": [[25, 50, 100, -1], [25, 50, 100, "All"]];
"sDom": 'rt<"bottom"iflp<"clear">>',
"sPaginationType": "full_numbers"
} )



  • Posts: 21,593
    What you can do is something like:

    That will give you an array of data from the 4th column which you can sum as you would do any other array :-)

  • Thanks :)
  • Hello ,

    any example for this ? i have tried but can not have the values for the columns

  • Posts: 21,593
    Here is my code from above running: . Have a look at the console in your browser and you'll see the data array.

  • Good work Allan, Is there any way i can output the sum result in a div. An example will do, thanks
  • Hi there, did you manage to resolve this, I am looking to do the same, when I looked at Allans example it doesnt appear to show summary in footer?

  • edited June 2012 Posts: 8
    Hi Allan, many thanks for the reply, I did indeed see that example and several others but not being good with js I am still struggling. Using your excellent example I did manage to sum a single column but cannot fathom out how to sum multiple from dynamic table. I edited your code to simply sum a column [1] as such;

    <script type="text/javascript" charset="utf-8"> $(document).ready(function() { $('#example').dataTable( { "fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay ) { var iTotalCases = 0; for ( var i=0 ; i<aaData.length ; i++ ) { iTotalCases += aaData[i][1]*1; } /* Calculate the market share for browsers on this page */ var iPageCases = 0; for ( var i=iStart ; i<iEnd ; i++ ) { iPageCases += aaData[ aiDisplay[i] ][2]*1; } /* Modify the footer row to match what we want */ var nCells = nRow.getElementsByTagName('th'); nCells[1].innerHTML = parseInt(iPageCases * 100)/100 + ''; } } ); } ); </script>
    Also tried this but doesn't output the summary;
    <script type="text/javascript" charset="utf-8"> $(document).ready(function() { $('#example').dataTable(); console.log( $('#example').dataTable()._('td:nth-child(2)') ) } ); </script>
    Kind Regards

  • Does anyone know how much the paid support is?

This discussion has been closed.