Question

我正在尝试将表格导出为PDF格式，宽度为100％。我尝试了以下但是我没有成功

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

Answer 1

找到一种更简单快捷的方法。

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

这里发生的事情是这样的：

doc.content[1].table.widths是每列的宽度数组，如果每个列都是'*'，则意味着该表将适合100％的页面，并且列均匀分布。

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

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

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

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

Answer 2

在挖掘和挖掘后，我发现你只需添加一个宽度为＆＃39; *＆＃39;对于每个列。我创建了一个简单的函数，以便根据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);

Answer 3

customize : function(doc){
    var colCount = new Array();
    var length = $('#reports_show tbody tr:first-child td').length;
    console.log('length / number of td in report one record = '+length);
    $('#reports_show').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(parseFloat(100 / length)+'%'); }
    });
}

它在我的案例中工作。它计算标题中的数据标记数。然后它为每个数据标签分配100 /（没有数据标签）宽度。

Answer 4

var dtTbl = tbl.DataTable({
            dom: 'Bt',
            buttons: [{
                    extend: "pdfHtml5",
                    title: "Report",
                    customize: function(doc) {
                        console.log(doc.content)
                        doc.content.splice(0, 0, {
                            margin: [12, 0, 0, 12],
                            alignment: "center",
                        });

                        doc.content[2].table.widths = ["*", "*", "*"];
                    }]
            })

这就是我所做的并且有效。我只有3个标题，所以我在表格宽度中插入了三个星号。

Answer 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
    }
}

Answer 6

您应该在＆＃39; pdfmake.js＆＃39;中查找 t.table.widths 的位置。文件并将值更改为＆＃39; *＆＃39;。

t.table.widths =＆＃34; *＆＃34;

Answer 7

这项工作出色...具有适应性。为我编辑。更改表的ID或类的类（.Datatable）

customize: function(doc) {
    var colCount = new Array();
    var tr = $('.DataTable tbody tr:first-child');
    var trWidth = $(tr).width();

    var length = $('.DataTable tbody tr:first-child td').length;
    $('.DataTable').find('tbody tr:first-child td').each(function() {
        var tdWidth = $(this).width();
        var widthFinal = parseFloat(tdWidth * 115);
        widthFinal = widthFinal.toFixed(2) / trWidth.toFixed(2);
        if ($(this).attr('colspan')) {
            for (var i = 1; i <= $(this).attr('colspan'); $i++) {
                colCount.push('*');
            }
        } else {
            colCount.push(parseFloat(widthFinal.toFixed(2)) + '%');
        }
    });
    doc.content[1].table.widths = colCount;
}

DataTables以100％宽度导出PDF

7 个答案: