Export 2 Kendo Grids on the same PDF page and a chart on the next page

41 Views Asked by At

I am trying to export 2 Kendo grids with only a few of rows of data on the same PDF page and a chart on the next page. I am able to current export these in 3 different pages. Here is how I'm doing it now.

function OnPdfExport() {
        var grid1 = $('#Grid1').data('kendoGrid');
        var grid2 = $('#Grid2').data('kendoGrid');

        var progress = $.Deferred();
        kendo.drawing.drawDOM($("#Chart"), { forcePageBreak: "#Chart", paperSize: "A4", landscape: true, margin: { left: "2cm", top: "2cm", right: "1cm", bottom: "1cm" }}).done(function (chart) {
            grid1._drawPDF(progress).then(function (firstGrid) {
                grid2._drawPDF(progress).then(function (secondGrid) {
                    secondGrid.children.forEach(function (x) {
                        firstGrid.children.push(x);
                    })
                    firstGrid.children.push(chart);
                    return kendo.drawing.exportPDF(firstGrid, { multiPage: true });
                }).done(function (dataURI) {
                    kendo.saveAs({
                        dataURI: dataURI,
                        fileName: "Report.pdf"
                    });
                    progress.resolve();
                })
            })
        })
}

    $("#Grid1").kendoGrid({
            dataSource: gridDataSource,
            pdf: {
                //allPages: true,
                paperSize: "A4",
                margin: { top: "6cm", right: "1cm", bottom: "1cm", left: "1cm" },
                landscape: true,
                template: $("#page-template").html()
            },
            columns: [{
               ... // many columns
            }]
        });
    $("#Grid2").kendoGrid({
            dataSource: gridDataSource2,
            pdf: {
                paperSize: "A4",
                margin: { top: "1cm", right: "1cm", bottom: "1cm", left: "1cm" },
                landscape: true
            },
            columns: [{
               ... // many columns
            }]
        });

Is there a way I could export the 2 grids with a report header template(#page-template) on first page of the PDF and a chart on the next page in the same PDF?

0

There are 0 best solutions below