Iterate DataTable() to get td value of every row

Question

I have created a table with DataTable() plugin: DataTable

Every row has a td with "amount" class. I want to iterate all rows to get all td values and save the sum into a variable.

I found this: each() , but I don't know how to integrate it.

UPDATE : code generated by DataTable()

<table id="table">
    <thead>
        <tr>
            <th>a</th>
            <th>b</th>
            <th>c</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Hello</td>
            <td>World</td>                              
            <td class="amount">346.387,81</td>
        </tr>
        <tr>
            <td>Hello</td>
            <td>World</td>                              
            <td class="amount">444.392,35</td>
        </tr>
    </tbody>
</table>

Answer 1

You can use:

var totalamount = 0;
$('#table td.amount').each(function(){
   totalamount += parseFloat($(this).text().replace(",",""),10)
});

Working Demo

Answer 2

In their documentation , there is an example that does exactly what you want to achive.

Take a look at the snippet below:

 $(function() { $('#example').DataTable({ footerCallback: function(row, data, start, end, display) { var api = this.api(); function intVal(i) { return typeof i === 'string' ? i.replace(/[\\$,]/g, '') * 1 : typeof i === 'number' ? i : 0; }; // Total over this page var total = api .column(1, { page: 'current' }) .data() .reduce(function(a, b) { return intVal(a) + intVal(b); }); // Update footer $(api.column(1).footer()).html( total ); } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script> <link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" /> <table id="example" class="display" cellspacing="0" width="80%"> <thead> <tr> <th>Name</th> <th>Amount</th> </tr> </thead> <tfoot> <tr> <th>Name</th> <th>Amount</th> </tr> </tfoot> <tbody> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> </table> 

Answer 3

This will parse the entire dataset and return the total:

 $(document).ready(function() { console.clear(); var oTable = $('#example').dataTable(); var rows = oTable.fnSettings().aoData; var columnIndex = 1; var total = 0; $.each(rows, function(i, val) { total += parseFloat(val._aData[columnIndex].replace(/,/g, "")); }); alert(total); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script> <link href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" /> <table id="example" class="display" cellspacing="0" width="80%"> <thead> <tr> <th>Name</th> <th>Amount</th> </tr> </thead> <tfoot> <tr> <th>Name</th> <th>Amount</th> </tr> </tfoot> <tbody> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> <tr> <td>Tiger Nixon</td> <td>320,800</td> </tr> <tr> <td>Garrett Winters</td> <td>170,750</td> </tr> <tr> <td>Ashton Cox</td> <td>86,000</td> </tr> <tr> <td>Cedric Kelly</td> <td>433,060</td> </tr> </table>