導出爲PDF增加每頁的項目數

Question

我有一個網格控件，我希望導出的內容。初始化後，pageSize屬性設置爲10項，但是我想在exportToPDF期間增加每頁項目的數量。

我試圖在執行導出之前修改dataSource的pageSize，但這似乎對最終產品沒有影響。

var grid = $("#grid").data("kendoGrid");          
var filter = grid.dataSource.filter; 
grid.dataSource.query({ 
    filter: filter, 
    pageSize: 20, // has no effect on the exported PDF 
    page: 1, 
    group: [{ 
     field: "groupField1", 
     dir: "asc" 
    }, { 
     field: "groupField2", 
     dir: "asc" 
    }, { 
     field: "groupField3", 
     dir: "asc" 
    }] 
}); 

var progress = $.Deferred(); 
grid._drawPDF(progress) 
    .then(function (root) { 
     return kendo.drawing.exportPDF(root, { forcePageBreak: ".page-break", multiPage: true }); 
    }) 
    .done(function (dataURI) { 
     // ... do some manual manipulation of dataURI 
     kendo.saveAs({ 
      dataURI: manipualtedDataURI 
     }); 
progress.resolve(); 

有什麼我很想念，所以我可以在PDF導出的每個頁面上顯示更多的項目？

編輯

包括由下面的答案建議pdfExport功能（永遠也不會被所謂的）我的網格定義：

var grid = $("#reportGrid").kendoGrid({       
    pdf: { 
     allPages: true, 
     avoidLinks: true, 
     repeatHeaders: true,    
     template: kendo.template($("#page-template").html()), 
     scale: 0.7, 
     margin: { top: "2.5cm", right: "1cm", bottom: "1.5cm", left: "1cm" }, 
     paperSize: "A4", 
     landscape: true 
    }, 
    // *this function is not getting called* 
    pdfExport: function(e) { 
     e.sender.dataSource.pageSize(10); 
     e.promise.done(function() { 
      e.sender.dataSource.pageSize(20); 
     }); 
    }, 
    toolbar: kendo.template($("#template").html()), 
    ... 
});  

注意：模板用於包括頁眉/頁腳在PDF導出的每個頁面上。

另注：「dataURI的手動操作」包括外出服務器執行與其他PDF文件合併，所以無法通過電網:(

編輯使用默認的出口2

我已經從@ RKSaini的回答擴展了Dojo的例子，使用我需要生成PDF導出的方法（根據原始文章） 代碼片段記錄了正在導出的網格的URI以及pdfExport函數是什麼時候如您所見，使用內置網格「導出到PDF」按鈕時，將顯示pdfExport功能被觸發，但當使用網格下方的附加按鈕時，它不是。

Answer 1

在導出PDF文件之前，您可以使用pdfExport事件更改網格數據源的頁面大小，然後當導出完成時您只需恢復上一頁大小。

該事件的回調函數接收網格實例作爲e.sender並且承諾作爲e.promise，可用於在導出完成時設置頁面大小。

欲瞭解更多信息檢查http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-pdfExport

$("#grid").kendoGrid({ 
    dataSource: dataSource, 
    pdf: { 
     allPages: true 
    }, 
    pdfExport: function(e) { 
     e.sender.dataSource.pageSize(10); 
     e.promise.done(function() { 
      e.sender.dataSource.pageSize(20); 
     }); 
    }, 
    ... 
    //Other configguration 
}); 

這裏是一個工作演示http://dojo.telerik.com/UzOXO

編輯

您還可以更改網格頁面大小在您的自定義導出功能只是改變電網頁面大小然後調用_drawPdf（）函數並在完成時將其更改。

$("#btnPdfExport").kendoButton({ 
    click: function() { 
     var grid = $("#grid").data("kendoGrid");          

     var progress = $.Deferred(); 
     // Change grid datasource pagesize before calling _drawPDF 
     grid.dataSource.pageSize(20); 
     grid._drawPDF(progress) 
      .then(function (root) { 
       return kendo.drawing.exportPDF(root, { forcePageBreak: ".page-break", multiPage: true }); 
      }) 
      .done(function (dataURI) { 
       console.log("Exporting " + dataURI); 
       kendo.saveAs({ 
        dataURI: dataURI, 
        fileName: "export.pdf" 
       }); 
       progress.resolve(); 
       // Change grid datasource pagesize when done 
       grid.dataSource.pageSize(10); 
      });    
    } 
}); 

這裏http://dojo.telerik.com/UzOXO/8