【问题标题】:Page footer not showing in pdfmakepdfmake中未显示页脚
【发布时间】:2018-10-08 16:04:39
【问题描述】:

我有以下代码,可在单击 pdf 时生成数据表 pdf。在自定义函数中,我有一个页脚代码,它应该显示页码。

   $(document).ready(function () {
            //SHOW EXSITING LINE ITEMS
            var id = @Model.Order.Id;
            table = $("#orders").DataTable({
                dom: 'Bfrtip',
                buttons: [
                 {
                    text: 'Download PDF',
                    extend: 'pdfHtml5',
                    className:'btn btn-primary',
                    orientation: 'landscape',                   
                    },
                    customize: function (doc) {               
                        //set header
                        doc.content[0].text = "SALES ORDER";
                        doc.page
                        doc.pageMargins = [10, 10, 10, 10];
                        doc.defaultStyle.fontSize = 12;
                        doc.styles.tableHeader.fontSize = 14;
                        doc.styles.title.fontSize = 14;
                        // Set page title
                        doc.content[0].text = "SALES ORDER";
                        // Create a footer
                        doc.footer = (function (page, pages) {
                            return {
                                columns: [
                                    'This is your left footer column',
                                    {
                                        // This is the right column
                                        alignment: 'center',
                                        text: ['page ', { text: page.toString() }, ' of ', { text: pages.toString() }]
                                    }
                                ],
                                margin: [10, 0]
                            }
                        });
                    }
                }
            ],

我添加了如上所示的页脚代码,但我似乎无法在我的 pdf 中获取页脚。我在这里做错了什么?

【问题讨论】:

    标签: jquery datatables pdfmake


    【解决方案1】:

    基本上你没有为页脚留出空间。可以使用doc.pageMargins增加页面底部的可用空间,例如

    doc.pageMargins = [10, 10, 45, 20]
    

    您还必须注意页脚的边距和大小。左边有一些文本,右边有页码的页脚可能如下所示:

    doc.footer = function(page, pages) {
      return {
        margin: [5, 0, 10, 0],
        height: 30,
        columns: [{
          alignment: "left",
          text: 'This is your left footer column',
        }, {
          alignment: "right",
          text: [
            { text: page.toString(), italics: true },
              " of ",
            { text: pages.toString(), italics: true }
          ]
        }]
      }
    }   
    

    演示 -> https://jsfiddle.net/np8em3sx/

    【讨论】:

    • 感谢您的提琴。在文档或 github 中我没有找到分页的工作示例,所以这非常有用。
    【解决方案2】:

    您需要调整页边距 pdfmake github issue

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-01-04
      • 2015-06-10
      • 1970-01-01
      • 1970-01-01
      • 2013-07-18
      • 2013-01-31
      • 2017-12-10
      相关资源
      最近更新 更多