Using Fixed header , scrollY, responsive at the same time but fixed header not working ?
Using Fixed header , scrollY, responsive at the same time but fixed header not working ?
alka
Posts: 4Questions: 3Answers: 0
I am using Fixed header , scrollY, responsive at the same time, but fixed header is not working. Code is as following.I know scrollY and fixedheader are not compatible. How can I solve this problem PLEASE HELP
var table = $('#table_id').DataTable({ retrieve: true, destroy: true, responsive: true, paging: false, scrollY: '68vh', "order": [], "oLanguage": { "sEmptyTable": "No Data available for this selection" }, columnDefs: [{ type: 'date', targets: [4] }, { type: 'date', targets: [5] }, ], dom: 'Bfrtip', buttons: [{ extend: 'csvHtml5', text: '', titleAttr: 'Download CSV', extension: '.csv', filename: 'Time Tracking Report - with Session details', exportOptions: { modifier: { page: 'current' } } }, { extend: 'pdfHtml5', text: '', titleAttr: 'Download PDF', alignment: 'center', bProcessing: true, footer: true, title: 'Time Tracking Report - with Session details', orientation: 'landscape', pageSize: 'LEGAL', message: 'Start Date:: ' + hidden_startdate_avail + ' - End Date:: ' + hidden_enddate_avail, pageSize: 'A4', exportOptions: { modifier: { page: 'current' } } }], "footerCallback": function(row, data, start, end, display) { var api = this.api(), data; // Remove the formatting to get integer data for summation var intVal = function(i) { return typeof i === 'string' ? i.replace(/[\$,]/g, '') * 1 : typeof i === 'number' ? i : 0; }; // Total over all pages total = api .column(6) .data() .reduce(function(first, second) { var first = intVal(first) + intVal(second); var first = first.toFixed(2); return first; }, 0); // Update footer $(api.column(6).footer()).html(+total); } }); if (result == undefined) { console.log(" "); } else { new $.fn.dataTable.FixedHeader(table); }
This discussion has been closed.