Question

我正在为我的项目使用datatable插件。我使用＆＃34; datatable＆＃34;而不是＆＃34; Datatable＆＃34;因为我使用.fnFilter函数会在＆＃34; Datatable＆＃34;中抛出错误。但目前我正尝试以不同的格式导出我的表数据，如csv，excel，pdf等。我使用下面的代码

$(document).ready(function(){
  var table= $('#testTable').dataTable({ 
    dom: 'Bfrtip',
    extend: 'collection',
    text: 'Export',
    buttons: [

      'copy', 'csv', 'excel', 'pdf', 'print'
    ]
  });


  $('#selectField').on('change', function () {
    var selectedValue = $(this).val();
    table.fnFilter("^"+selectedValue+"$", 4, true);
  });
  $('#selectField1').on('change', function () {
    var selectedValue = $(this).val();
    table.fnFilter("^"+selectedValue+"$", 3, true);
  });
  $('#selectField2').on('change',function(){
    var selectedValue = $(this).val();
    table.fnFilter("^"+selectedValue+"$", 5, true); //Exact value, column, reg
  });
});

但导出按钮的选项不会显示为按钮。相反，它显示为链接。任何人都可以建议我如何按预期获得输出？

包含的文件是：

<spring:url value="/resources/jquery-1.12.4.min.js" var="minJS" />
    <script src="${minJS}"></script>
     <spring:url value="https://code.jquery.com/jquery-1.12.3.js" var="minJS1" />
    <script src="${minJS1}"></script>
     <spring:url value="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" var="bootJS1" />
    <script src="${bootJS1}"></script>
    <spring:url value="http://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js" var="datatable" />
    <script src="${datatable}"></script>
    <spring:url value="http://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" var="datacss" />
        <link href="${datacss}" rel="stylesheet" /> 
         <spring:url value="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" var="BOOT" />
 <link href="${BOOT}" rel="stylesheet" />
    <spring:url value="/resources/BIS.js" var="crunchifyJS" />
    <script src="${crunchifyJS}"></script>
    <spring:url value="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js" var="buttonJS" />
    <script src="${buttonJS}"></script>
    <spring:url value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.flash.min.js" var="flashJS" />
    <script src="${flashJS}"></script>
    <spring:url value="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js" var="zipJS" />
    <script src="${zipJS}"></script>
    <spring:url value="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js" var="pdfJS" />
    <script src="${pdfJS}"></script>
    <spring:url value="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js" var="fontJS" />
    <script src="${fontJS}"></script>
     <spring:url value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js" var="htmJS" />
    <script src="${htmJS}"></script>
     <spring:url value="https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js" var="printJS" />
    <script src="${printJS}"></script>
       <spring:url value="/resources/a.css" var="crunchifySS" />
 <link href="${crunchifySS}" rel="stylesheet" />
  <spring:url value="https://cdn.datatables.net/buttons/1.2.2/css/buttons.dataTables.min.css" var="ButtonSS" />
 <link href="${buttonSS}" rel="stylesheet" />

Answer 1

好的，看起来正确的文件存在但是很难找出问题所在。打开应用程序，我推荐Chrome，打开开发人员工具（F12），然后单击最左边的按钮（元素选择器），单击其中一个链接（应该是按钮的链接）。在右侧的开发工具窗口中，它将显示哪些样式表应用了哪些样式。

导出数据表中的数据

1 个答案: