bootstrap数据表导出按钮

Question

<script>
$(document).ready(function() {
$('#example').DataTable( {
    "language": {
        "url": "../jquery/plugins/dataTables/ff.json"
        },
        "columns": [ null, null, { "width": "6%" }, { "width": "6%" } ],
        "order": [],
        "columnDefs": [ {"targets"  : 'no-sort', "orderable": false} ],
        "dom": 'Bfrtip',
        "buttons": [ 'copyHtml5', 'excelHtml5', 'csvHtml5', 'pdfHtml5' ]            
 });
$("[data-toggle=tooltip]").tooltip();

}）;

任何人都可以帮助我...除了显示导出按钮外，一切正常...请提前感谢您的帮助

Answer 1

您必须包含用于HTML5导出按钮的额外JS文件才能工作。

使用Download Builder并生成JS / CSS链接，包括以下组件：

• <强>按钮

  • HTML5导出
  • 的 JSZip
  • 的 pdfmake

$('#example').DataTable( {
    "language": {
       "url": "../jquery/plugins/dataTables/ff.json"
    },
    "columns": [ null, null, { "width": "6%" }, { "width": "6%" } ],
    "order": [],
    "columnDefs": [ {"targets"  : 'no-sort', "orderable": false} ],
    "dom": 'Bfrtip',
    "buttons": [ 'copyHtml5', 'excelHtml5', 'csvHtml5', 'pdfHtml5' ]            
 });

请参阅this jsFiddle进行演示。