jQuery Datatables按鈕顯示爲鏈接..不按鈕

使用jQuery DataTables 1.10.15我試圖使用文件導出選項。jQuery Datatables按鈕顯示爲鏈接..不按鈕

這裏是我的腳本是如何加載頁面上：

<script src="/Scripts/DataTables/jquery.dataTables.js"></script> 
<script src="/Scripts/DataTables/dataTables.bootstrap.js"></script> 
<script src="/Scripts/DataTables/dataTables.buttons.min.js"></script> 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.flash.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script> 
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/pdfmake.min.js"></script> 
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/vfs_fonts.js"></script> 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.html5.min.js"></script> 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.print.min.js"></script>

這裏是我的DataTable設置：

var table = $('#NewTable').DataTable({ 
    dom: 'Bfrtip', 
    buttons: [ 'excel', 'pdf' ], 
    'aoColumnDefs': [ 
     { "bSortable": false, "aTargets": [2, 7] }, 
     { "bSearchable": false, "aTargets": [7] } 
    ] 
});

這裏是他們是如何顯示：

我如何讓它們顯示爲按鈕而不是鏈接？

來源

2017-07-28 GTown-Coder

你很可能錯過了正確的CSS文件。

嘗試添加此css鏈接（從CDN）到您的標題。

https://cdn.datatables.net/buttons/1.3.1/css/buttons.dataTables.min.css

工作例如：

var table = $('#NewTable').DataTable({ 
 
    dom: 'Bfrtip', 
 
    buttons: [ 'excel', 'pdf' ], 
 
    'aoColumnDefs': [ 
 
     { "bSortable": false, "aTargets": [2, 7] }, 
 
     { "bSearchable": false, "aTargets": [7] } 
 
    ] 
 
});

<link href="https://cdn.datatables.net/buttons/1.3.1/css/buttons.dataTables.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/dataTables.buttons.min.js"></script> 
 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.flash.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script> 
 
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/pdfmake.min.js"></script> 
 
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.27/build/vfs_fonts.js"></script> 
 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.html5.min.js"></script> 
 
<script src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.print.min.js"></script> 
 
<table id="NewTable"></table>

來源

2017-07-28 15:46:25 H77

啊，就是這樣！ –

jQuery Datatables按鈕顯示爲鏈接..不按鈕

回答

相關問題