使用 datatables.net 导出为 pdf 时设置列宽 [英] set column width when exporting to pdf when using datatables.net

问题描述

我有一张我想导出的表格，但是当内容很短时，一列的宽度很长，并且使用 datatables.net 中的代码将其导出为 pdf 时，布局看起来不太好导出时，这是我的代码

hi i have this table that i wanted to export but the width of one column is so long when the content is only short and it makes the layout not looking good when it is exported to pdf im using the codes from datatables.net when exporting and here is my code

$(document).ready(function() {
    var currentDate = new Date()
    var day = currentDate.getDate()
    var month = currentDate.getMonth() + 1
    var year = currentDate.getFullYear()

    var d = day + "-" + month + "-" + year;
    $('#detailTable').DataTable({
        dom: 'Bfrtip',
        buttons: [{
            extend: 'excelHtml5',
            title: d + ' Purchase Orders'
        }, {
            extend: 'csvHtml5',
            title: d + ' Purchase Orders'
        }, {
            extend: 'pdfHtml5',
            title: d + ' Purchase Orders',
            orientation: 'landscape',
            pageSize: 'LEGAL',
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
            }
        }]
    });
});

有没有办法设置特定列的宽度?提前致谢

is there a way where i can set the width of a specific column? thanks in advance

推荐答案

您可以使用 customize 回调来更改 PDFmakes 的样式字典".如果要强制 #2 列的宽度为 100px 或最大 100px，请执行以下操作:

You can use the customize callback to alter PDFmakes' "style dictionary". If you want to force the #2 column to be 100px or max 100px in width, do this :

{
  extend: 'pdfHtml5',
  title: d + ' Purchase Orders',
  orientation: 'landscape',
  pageSize: 'LEGAL',
  exportOptions: {
     columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]
  },
  //-------------------------- 
  customize : function(doc) {
     doc.styles['td:nth-child(2)'] = { 
       width: '100px',
       'max-width': '100px'
     }
  }
}

这将通过CSS样式规则

This will pass the CSS style rule

td:nth-child(2) {
  width: 100px;
  max-width: 100px;
}

到PDFmake.请参阅文档 -> http://pdfmake.org/#/gettingstarted 转到样式词典"部分

to PDFmake. See the documentation -> http://pdfmake.org/#/gettingstarted go for section "Style dictionaries"

这篇关于使用 datatables.net 导出为 pdf 时设置列宽的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！