putTotalPages在jspdf-autotable標題中不起作用

Question

我想將使用jspdf和jspdf-autotable生成的PDF添加到'頁面編號x'中。我使用jspdf-autotable示例站點上的examples.js文件中的代碼，並使用了本網站中包含putTotalPages函數的jspdf.debug.js文件。

我在每個頁面上得到的結果是'第1頁{total_pages_count_string}'和第2頁上的{total_pages_count_string}'的第2頁，即total_pages_count_string似乎沒有正確更新。

我的整個代碼如下：

$('#print').click(function() { 
      $('#html-table table').remove(); 
      var table = $("#amu-whiteboard").tabulator("getHtml"); 
      $('#html-table').append(table); 
      $('#html-table>table').attr("id", "table"); 
      $('#table th:not(:nth-child(1), :nth-child(2)), #table td:not(:nth-child(1), :nth-child(2))').remove(); 
      var columns = ["Bed", "Name", "Diagnoses", "Jobs"]; 
      var doc = new jsPDF('l', 'pt'); 
      doc.setFont('Helvetica', 'normal'); 
      doc.setTextColor(40); 
      var dateTime = moment().format('HH:mm on MMMM Do, YYYY'); 
      var printedOn = "Printed at " + dateTime; 
      var totalPagesExp = "{total_pages_count_string}"; 
      var pageContent = function(data) { 
       doc.setFontSize(14); 
       doc.text(21, 30, "AMU Handover Sheet"); 
       doc.setFontSize(10); 
       doc.text(printedOn, doc.internal.pageSize.width/2, 30, 'center'); 
       var str = "Page " + data.pageCount; 

       if (typeof doc.putTotalPages === 'function') { 
        str = str + " of " + totalPagesExp; 
       } 
       doc.text(str, doc.internal.pageSize.width - 20, 30, 'right'); 
      }; 
      if (typeof doc.putTotalPages === 'function') { 
       doc.putTotalPages(totalPagesExp); 
      } 
      var elem = document.getElementById("table"); 
      var res = doc.autoTableHtmlToJson(elem); 
      doc.autoTable(columns, res.data, { 
       addPageContent: pageContent, 
       theme: 'grid', 
       tableLineWidth: 0, 
       bodyStyles: { 
        halign: 'center', 
        valign: 'middle', 
        fillColor: 250, 
        lineWidth: 0.5, 
        lineColor: 180, 
        cellPadding: 6, 
        fontSize: 11 
       }, 
       margin: { 
        horizontal: 20, 
        bottom: 40, 
        top: 40 
       }, 
       drawRow: function(row, data) { 
        doc.setFontSize(12); 
        doc.setFontStyle('bold'); 
        if (row.index === 0) { 
         doc.setTextColor(30); 
         doc.rect(data.settings.margin.left, row.y, data.table.width, 30, 'S'); 
         doc.autoTableText("A BAY", data.settings.margin.left + 5, row.y + 16, { 
          halign: 'left', 
          valign: 'middle' 
         }); 
         data.cursor.y += 30; 
        } else if (row.index === 6) { 
         doc.setTextColor(30); 
         doc.rect(data.settings.margin.left, row.y, data.table.width, 30, 'S'); 
         doc.autoTableText("B BAY", data.settings.margin.left + 5, row.y + 16, { 
          halign: 'left', 
          valign: 'middle' 
         }); 
         data.cursor.y += 30; 
        } else if (row.index === 17) { 
         doc.setTextColor(30); 
         doc.rect(data.settings.margin.left, row.y, data.table.width, 30, 'S'); 
         doc.autoTableText("C BAY", data.settings.margin.left + 5, row.y + 16, { 
          halign: 'left', 
          valign: 'middle' 
         }); 
         data.cursor.y += 30; 
        } else if (row.index === 28) { 
         doc.setTextColor(30); 
         doc.rect(data.settings.margin.left, row.y, data.table.width, 30, 'S'); 
         doc.autoTableText("SIDE ROOMS", data.settings.margin.left + 5, row.y + 16, { 
          halign: 'left', 
          valign: 'middle' 
         }); 
         data.cursor.y += 30; 
        } else if (row.index === 30) { 
         doc.setTextColor(30); 
         doc.rect(data.settings.margin.left, row.y, data.table.width, 30, 'S'); 
         doc.autoTableText("FAIRFAX", data.settings.margin.left + 5, row.y + 16, { 
          halign: 'left', 
          valign: 'middle' 
         }); 
         data.cursor.y += 30; 
        } 
       }, 
       headerStyles: { 
        fillColor: 120, 
        halign: 'center', 
        valign: 'middle', 
        fontSize: 12, 
       }, 
       alternateRowStyles: { 
        fillColor: 255 
       }, 
       columnStyles: { 
        0: { 
         columnWidth: 40 
        }, 
        1: { 
         columnWidth: 180, 
         halign: 'left', 
        }, 
        2: { 
         columnWidth: 240 
        }, 
       } 
      }); 
      doc.save("table.pdf"); 
     }) 

任何人都可以建議我在哪裏這個問題呢？

Answer 1

我認爲putTotalPages()必須在autotable後調用。