Ajithkumar T

Ajithkumar T

  • 1.5k
  • 220
  • 420

Footer problem in datatables

Apr 11 2024 5:33 AM

    var rid="3";
    var yr="2024";
    var mtg=0;
    var mg=0;
    var bsum=0;
    var tableTN = $('#TdataTable').DataTable( {
      columnDefs: [{
                  "className": "dt-center",
                  "targets": "_all"
    }],

             "ordering": false,
             "stateSave": true,
             "serverSide": false,
             "fixedHeader": true,
            "paging": true,
            "pageLength": 100,
            "lengthMenu": [[10, 25, 50,100, -1], [10, 25, 50,100, "All"]],

            "ajax": {
                'type': 'POST',
             'url':baseURL +'targetList',
             'data': {
           id: rid,
           year: yr
        },
             "dataSrc": function(json) {
                    mtg=Math.round(json.target/12);
                    mg=mtg;
                    $('#exe').text(json.exe);
                     console.log(json.exe);
                     $('#yr').text(json.yr);
                     return json.data;
                },
          },
          'columns': [
		         	{ data: 'Clientname' },
		         	{ data: 'JAN' },
		         	{ data: 'FEB' },
		         	{ data: 'MAR' },
		         	{ data: 'APR' },
		         	{ data: 'MAY' },
		         	{ data: 'JUN' },
		         	{ data: 'JUL' },
		         	{ data: 'AUG' },
		         	{ data: 'SEP' },
		         	{ data: 'OCT' },
		         	{ data: 'NOV' },
		         	{ data: 'DEC' },
		         	{ data: 'Total' }
		      	],

      "footerCallback": function(row, data, start, end, display) {
  var api = this.api();
 var secondaryFooterValues = []; 
 var thirdFooterValues = []; 
 secondaryFooterValues.push("Target");
 thirdFooterValues.push("Achieved");
 var sum=0;
  api.columns('.sum', {
    page: 'current'
  }).every(function() {
    sum = this
      .data()
      .reduce(function(a, b) {
        var x = parseFloat(a) || 0;
        var y = parseFloat(b) || 0;
        return x + y;
      }, 0);

    $(this.footer()).html(sum);

    bsum=mg-sum;
    secondaryFooterValues.push(mg);

    thirdFooterValues.push(Math.round(sum/mg*100)+"%");
    mg=mtg+bsum;
  });
  secondaryFooterValues[13]=mtg*12;
 thirdFooterValues[13]=Math.round((sum/(mtg*12))*100)+"%";

  var secondaryFooter = $(api.table().footer()).find('.secondary-footer');
  if (secondaryFooter.length === 0) {
    secondaryFooter = $('<tr align="center" class="secondary-footer"></tr>').appendTo(api.table().footer());
  }
  secondaryFooter.empty(); // Clear existing content
  secondaryFooterValues.forEach(function(value) {
    $('<td>').html(value).appendTo(secondaryFooter);
  });
  var thirdFooter = $(api.table().footer()).find('.third-footer');
  if (thirdFooter.length === 0) {
    thirdFooter = $('<tr align="center" class="third-footer" style="font-size:16px;font-weight:bold;color:red"></tr>').appendTo(api.table().footer());
  }
  thirdFooter.empty(); // Clear existing content
  thirdFooterValues.forEach(function(value) {
    $('<td>').html(value).appendTo(thirdFooter);
  });

},"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
          $('td', nRow).eq(0).css('color', 'blue');
        },
     //dom: '<"top">rtl<"bottom"ip><"clear">',
dom: 'Brtip',
        "buttons": [
       {
       extend: 'excelHtml5',
       exportOptions: {
    rows: function(idx, data, node) {
          return true; // Export all rows
        },
           columns: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13],
             footer: true
       }
   },
   {
       extend: 'pdfHtml5',
       exportOptions: {
           columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13],
             footer: true
       }
   }
 ],

    } );

when i export data to excel sheet footers content did not available in the table.how do i get? Please assist me..

Thanks


Answers (3)