时间戳

首页 > 解决方案 > JSPDF Autotable不导出定义的表格页脚

jspdf - JSPDF Autotable不导出定义的表格页脚

问题描述

我有一个基于动态数据定义的 html 表。该表包含一个thead、tfoot 和tbody。tfoot 映射到我的 json 中的特定值。但是，当使用 JSPDF Autotable 并导出为 PDF 时，不会呈现页脚。我已经看到了有关 showfoot 选项的信息但没有代码示例，并在 doc.autotable 之后尝试过，甚至在样式选项之后尝试过，但无济于事。不导出页脚。我敢肯定它超级简单 - 但我似乎无法弄清楚。注意：我不希望 JSDPF Autotable “创建”页脚 - 它已定义，它是我的表格的一部分 - 我只是希望它呈现在 pdf 上。我发现了一个 2016 年的旧 stackoverflow，其中提到了这一点 - Simon B. 评论说它将被添加 - 主题已关闭 - 但我在任何地方都找不到代码示例。

这是我试图“显示我的页脚”的 jspdf 自动表格代码 - 但无济于事。任何帮助表示赞赏。

<script>
function generate() {
    //Creation of PDF document
    let doc = new jsPDF('l', 'pt');
    const totalPagesExp = '{total_pages_count_string}';


    var elem = document.getElementById('${pm.info.requestId}');
    var data = doc.autoTableHtmlToJson(elem);

    doc.autoTable(data.columns, data.rows, {
        headStyles: {
            cellWidth: 'wrap',
            fontSize: 10,
            lineWidth: 0,
            lineColor: [0, 0, 0],
            textColor: [0, 0, 0],
            fillColor: [255,255,255]
        },
        bodyStyles: {
            cellWidth: 'wrap',
            fontSize: 8,
            lineWidth: 0,
            lineColor: [0, 0, 0],
            textColor: [0, 0, 0],
            fillColor: [255,255,255]
        },
        footStyles: {
            cellWidth: 'wrap',
            fontSize: 10,
            lineWidth: 0,
            lineColor: [0, 0, 0],
            textColor: [0, 0, 0],
            fillColor: [211,211,211]
        },
        //Formatting of pages
        didDrawPage: function (data) {
            //Summa logo on top of the page
            doc.addImage('${pm.variables.get("summa")}', 'PNG', 20, 20, 145, 42.63);
            //Font sizes of report information
            doc.setFontSize(8);
            //Report information: portfolio name, knowledge time and report time
            doc.text(35, 75, '${pm.variables.get("portfolioName")}');
            doc.text(35, 85, '${pm.variables.get("reportTime")}');
            doc.text(35, 95, '${pm.variables.get("knowledgeTime")}');
            //Page numbers
            var str = "Page " + doc.internal.getNumberOfPages()
            if (typeof doc.putTotalPages === 'function') {
                str = str + " of " + totalPagesExp;
            };
            //Page size
            var pageSize = doc.internal.pageSize;
            var pageHeight = pageSize.height ? pageSize.height : pageSize.getHeight();
            doc.text('Theme "plain"', 14, 16);
        },
        margin: {
            top: 100
        },


    });
    //Number of pages
    if (typeof doc.putTotalPages === 'function') {
        doc.putTotalPages(totalPagesExp);
    },

    //--------------------------------------------------------------------------------------------------START
    //Change name of report if desired
    doc.save('${pm.info.requestName}${pm.variables.get("reportTime")}.pdf');
    //--------------------------------------------------------------------------------------------------END
}

标签： jspdfjspdf-autotabletable-footer

解决方案

不确定您是否已经设法将页脚总数导出到 jspdf。我得到了它的工作，稍作调整。

替换var elem = document.getElementById('${pm.info.requestId}');到var elem = document.getElementById('NAME');

并将其替换doc.autoTable(data.columns, data.rows, {为 doc.autoTable({html: '#NAME',

推荐阅读