代码之家 › 专栏 › 技术社区 › user8012596

Datatable pdf自定义不在标题中选取动态值

datatables-1.10 jquery php

user8012596 · 技术社区 · 7 年前

'Vehicle ID:'+$("#vehicleID").val()+'\nDate Start:', 但它看起来就像 Vehicle IDDate Start 在顶部。如何同时添加页脚和页码?

var oTable = $('#dashboardGrid').dataTable({
                    "order": [[ 1, "asc" ]],
                    "aoColumnDefs": [ { "bSortable": false, "aTargets": [ 0,1 ] }],
                        "processing": true,
                    "serverSide": true,
              "ajax": {
                        "url": "getData.php",
                        "type": "POST",
                        "data": function(d) {
                            d.vID = $("#vehicleID").val()
                            d.startDateTime = startDateTimeFinal
                            d.endDateTime = endDateTimeFinal
                         }                

                    },
                    dom: 'Bfrtip',
                    lengthMenu: [
            [ 10, 25, 50, -1 ],
            [ '10 rows', '25 rows', '50 rows', 'Show all' ]
        ],
        buttons: [
           'pageLength', 'copy', 'csv', 'excel', 'pdf', 'print',
           {
           extend: 'pdf',
                        title: 'Vehicle ID:'+$("#vehicleID").val()+'\nDate Start:',
                        text: 'Pdf',
                        orientation: 'landscape',
                        pageSize: 'A4',
                        exportOptions: {
                        columns: [ 0, 1, 2, 3, 5 ]
                        },
                        customize: function ( doc ) {
                        doc.content[1].table.widths = [
                        '5%',
                        '30%',
                        '30%',
                        '10%',
                        '10%'

                        ]
                        }
           }

这是我包含的.js的完整列表。

   <script src="dt/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="dt/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
    <script src="dt/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
    <script src="dt/datatables.net-buttons-bs/js/buttons.bootstrap.min.js"></script>
    <script src="dt/datatables.net-buttons/js/buttons.flash.min.js"></script>
    <script src="dt/datatables.net-buttons/js/buttons.html5.min.js"></script>
    <script src="dt/datatables.net-buttons/js/buttons.print.min.js"></script>
    <script src="dt/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js"></script>
    <script src="dt/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
    <script src="dt/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
    <script src="dt/datatables.net-responsive-bs/js/responsive.bootstrap.js"></script>
    <script src="dt/datatables.net-scroller/js/dataTables.scroller.min.js"></script>
    <script src="dt/datatable-plugin/fnReloadAjax.js"></script>
    <script src="dt/jszip/dist/jszip.min.js"></script>
    <script src="dt/pdfmake/build/pdfmake.min.js"></script>
    <script src="dt/pdfmake/build/vfs_fonts.js"></script>

这是我的临时链接 http:///testReport1.php

1 回复 | 直到 7 年前

davidkonrad 7 年前

按钮现在似乎可以识别函数属性。至少是我在下面提到的1.3.1版本。一次一点 hack 为了动态设置文件名或标题,需要。这适用于1.10.15和按钮1.3.1:

$('#example').DataTable( {
  dom: 'Bfrtip',
  buttons: [{
    extend: 'pdfHtml5',
    filename: function() {
      return $('#filename').val()      
    },
    title: function() {
      return $('#message').val()
    }
  }]
});

https://jsfiddle.net/2nwqa2jk/

title: 'Vehicle ID:'+$("#vehicleID").val()+'\nDate Start:' 然后在初始化时对该表达式求值一次。如果传递函数,则在生成PDF时执行。