DataTables以100%宽度导出PDF

Dou*_*ell 9 css pdf jquery datatables

我试图将表格导出为PDF格式,宽度为100%.我尝试过以下但是我没有成功

var settings={};
settings.buttons = [
    {
        extend:'pdfHtml5',
        text:'Export PDF',
        orientation:'landscape',
        customize : function(doc){ 
            doc.styles['table'] = { width:100% }
        }
    }
];
$('.dTable').dataTable(settings);
Run Code Online (Sandbox Code Playgroud)

Rab*_*Gur 36

找到了一种更简单,更快捷的方法.

{
  extend: 'pdf',
  customize: function (doc) {
    doc.content[1].table.widths = 
        Array(doc.content[1].table.body[0].length + 1).join('*').split('');
  }
}
Run Code Online (Sandbox Code Playgroud)

这里发生的事情如下:

doc.content[1].table.widths是每列的宽度数组,如果它们中的每一列都是a,'*'则意味着该表将适合页面的100%,并且列均匀分布.

Array(doc.content[1].table.body[0].length + 1) 在我表的所有列的长度中创建一个数组.

.join('*')从数组中的所有单元格创建一个字符串,每个单元格'*'都有一个.

.split(''); 将其拆分为数组.

希望我一路上帮助过某人.

  • 这似乎可行,但超出了正确的页边距 (3认同)
  • 工作完美!谢谢 (2认同)

Dou*_*ell 5

在挖掘和挖掘之后,我发现您只需要为每一列添加一个 '*' 宽度。我创建了一个简单的函数,以便根据 td 标签的数量创建一个数组,并包含一个 colspan 检查。

var tbl = $('.dTable');
var settings={};
settings.buttons = [
    {
        extend:'pdfHtml5',
        text:'Export PDF',
        orientation:'landscape',
        customize : function(doc){
            var colCount = new Array();
            $(tbl).find('tbody tr:first-child td').each(function(){
                if($(this).attr('colspan')){
                    for(var i=1;i<=$(this).attr('colspan');$i++){
                        colCount.push('*');
                    }
                }else{ colCount.push('*'); }
            });
            doc.content[1].table.widths = colCount;
        }
    }
];
$('.dTable').dataTable(settings);
Run Code Online (Sandbox Code Playgroud)


小智 5

您可以为每列选择所需的尺寸,并让它们适合您需要的空间。您只需要对此进行一些调整:

"doc.content[1].table.widths = [90,90,90,90,90,90,90,90]; " : {
    extend: 'pdfHtml5',
    orientation: 'landscape',//orientamento stampa
    pageSize: 'A4', //formato stampa
    alignment: "center", //non serve a nnt ma gli dice di stampare giustificando centralmente
    titleAttr: 'PDF',   //titolo bottone
    exportOptions: {// quali colonne vengono mandate in stampa (indice posizionale)
        columns: [ 1,2,3,4,5,6,7,8 ]
    },
    customize : function(doc){ 
        doc.styles.tableHeader.alignment = 'left'; //giustifica a sinistra titoli colonne
        doc.content[1].table.widths = [90,90,90,90,90,90,90,90]; //costringe le colonne ad occupare un dato spazio per gestire il baco del 100% width che non si concretizza mai
    }
}
Run Code Online (Sandbox Code Playgroud)