DataTables导出不适用于更新的页脚内容

时间:2018-05-23 13:37:04

标签: datatable bootstrap-4

我有两个模块。

一种是将页脚数更新为千位分隔。 另一个是数据表启动器

//Module 1
    makeThousands();//This works fine

//Module2
        $('#myTable01').DataTable({
          'paging'        : false,
          dom: 'Bfrtip',
           buttons: [
                { extend: 'excelHtml5', footer: true },
                // { extend: 'pdfHtml5', footer: true },
            ]
    });

页脚填充了我预期的内容,并且Datatable工作正常。

但问题是当我使用数据表导出下载数据时,更新的页脚值似乎不在excel中。只有加载文档时加载的值才可用。

如何在数据表导出

中获取更新的(使用javascript事件)页脚行

$(document).ready(function(){
 
 $('#myTable01').DataTable({
      'paging'        : false,
      dom: 'Bfrtip',
       buttons: [
            { extend: 'excelHtml5', footer: true },
            // { extend: 'pdfHtml5', footer: true },
        ]

  });
  
  });
<link rel="stylesheet"  href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" />

<link rel="stylesheet"  href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/css/dataTables.bootstrap.css" />

<link rel="stylesheet"  href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" /><link rel="stylesheet"  href="https://cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css" />
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js"></script>


<table id="myTable01" class="ExcelTable2007 table table-striped table-bordered">
			<thead>
			<tr><th colspan="17" style="text-align:center;">ABSENCE HOURS DETAILS - 2018</th></tr>
			<tr><th>S.No</th><th>Dept</th><th>Jan</th><th>Feb</th><th>Mar</th><th>Apr</th><th>May</th><th>Jun</th><th>Jul</th><th>Aug</th><th>Sep</th><th>Oct</th><th>Nov</th><th>Dec</th><th>Total</th></tr></thead><tbody><tr><td>1</td><td>ABS</td><td class="numbers_style">2,557</td><td class="numbers_style">2,471</td><td class="numbers_style">2,371</td><td class="numbers_style">3,363</td><td class="numbers_style">4,278</td><td class="numbers_style">2,946</td><td class="numbers_style">6,659</td><td class="numbers_style">6,952</td><td class="numbers_style">2,888</td><td class="numbers_style">5,512</td><td class="numbers_style">2,240</td><td class="numbers_style">6,134</td><td class="numbers_style">48,370</td></tr></tbody><tfoot><tr><th></th><th></th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th><th class="cols_sum">12,300</th></tr></tfoot></table>

1 个答案:

答案 0 :(得分:0)

我也面临同样的问题,我将按钮代码与Datatable JS代码分开。这段代码对我有用。

var table = $('#myTable01').DataTable();

new jQuery.fn.dataTable.Buttons(table, {
        "buttons": [{
                extend: 'excel',
                filename: 'Admin functions New site Report',
                text: 'Admin Report',
                exportOptions: {
                    columns: [1, 3, 13, 14, 15, 16, 14, 35]
                }
            }, ]
    });

这对我有用。希望这会对你有所帮助。