Datatables adding JSON data to footer <tfoot>

Question

I am using datatables to display some data in JSON format and I've included the query totals at the bottom of the JSON like so:

{
    "data": [
        {
            "id": "1",
            "provider_num": "381301",
            "provider_name": "COTTAGE GROVE COMMUNITY HOSPITAL",
            "261_total_bad_debts": "$0",
            "271_medicare_bad_debts": "$79,275",
            "281_non_medicare_bad_debts": "$-79,275",
            "1_cost_to_charge_ratio": "0.703459",
            "291_cost_of_non_mcr_bad_debts": "$-55,767"
        }
    ],
    "total_bad_debts": 0,
    "total_medicare_bad_debts": 79275,
    "total_non_medicare_bad_debts": -79275,
    "total_cost_of_non_mcr_bad_debts": -55767
}

I'm a bit confused on how I can add them to the footer of my table as before I had access to the php variables directy and now I'm encoding them in the JSON. If anyone has any experience with this and using footerCallback in the datatables initialization that would really be great.

Thanks in advance

Answer 1

You can do use data from JSON response in DataTables footer as shown below.

$('#example').dataTable( {
   'ajax': 'data/arrays.txt',
   'footerCallback': function( tfoot, data, start, end, display ) {    
      var response = this.api().ajax.json();
      if(response){
         var $td = $(tfoot).find('td');
         $td.eq(0).html(response['total_bad_debts']);
         $td.eq(1).html(response['total_medicare_bad_debts']);
         $td.eq(2).html(response['total_non_medicare_bad_debts']);
         $td.eq(3).html(response['total_cost_of_non_mcr_bad_debts']);
      }
   } 
});