export scheduler pdf with multi pages

4 posts, 1 answers
  1. Robert
    Robert avatar
    56 posts
    Member since:
    Sep 2011

    Posted 12 Sep Link to this post

    trying to get scheduler to print out in agenda view onto multiple pages. I can get it crammed onto one page and completely useless and unreadable or i can get 2 pages, one with a header and the other runs off page and data becomes missing.

    I tried some options from http://www.telerik.com/forums/better-(configurable)-pdf-output-on-the-scheduler but no avail.

    So short question: can kendo ui scheduler export to pdf on multi pages AND look ok? If so how?

    here is my code snippet

     

    <button onclick='getPDF("section")'>Custom page Export</button>

     

     function getPDF(selector) {
                kendo.drawing.drawDOM($(selector), {
                    paperSize: "Letter",
                    multiPage: true,
                    margin: { top: "2cm", left: "1cm", right: "1cm", bottom: "1cm" }
                }).then(function (group) {
                    //Render the result as a PDF file
                    return kendo.drawing.exportPDF(group);
                }).done(function (data) {
                    //Save the PDF file
                    kendo.saveAs({
                        dataURI: data,
                        fileName: "Calendar.pdf",
                        proxyURL: "https://www.DOMAINNAME.com/Homeroom/Calendar/Export"
                    });
                });
            }

  2. Answer
    Peter Milchev
    Admin
    Peter Milchev avatar
    144 posts

    Posted 14 Sep Link to this post

    Hello Robert,

    The multipage PDF export functionality is not supported out of the box and needs custom implementation. One possible approach is to directly use the KendoUI PdfExport feature and follow the help topic below about how to split the content on multiple pages:


    Please use the following example as a starting point and modify it to best fit your scenario - Dojo example.

    Regards, Peter Milchev
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
  4. Robert
    Robert avatar
    56 posts
    Member since:
    Sep 2011

    Posted 26 Sep Link to this post

    UPDATE: that worked great on a desktop with Chrome in full desktop mode.

    However, on a mobile phone or chrome dev tools as iPhone6, then the PDF is not rendered correctly. It drops agenda entries and whole days with all their entries. Please see attached. Tuesday the 27th has multiple entries and it only shows 1. Also, the 29th is missing data.

    I am using the code snippet:

     

                        pdfExport: function(e) {
                            if ($("#scheduler").getKendoScheduler().view().name != 'agenda')
                                return;

                            e.preventDefault();
                            var drawing = kendo.drawing;

                            //workaround PDF export rowspan limitation
                            $(".k-scheduler-content table [rowspan]")
                                .each(function() {
                                    var currentCell = $(this);
                                    var rowSpan = parseInt(currentCell.attr("rowspan"));
                                    var currentRow = currentCell.closest("tr");

                                    var nextRow = null;
                                    for (var i = 0; i < rowSpan - 1; i++) {
                                        nextRow = nextRow ? nextRow.next() : currentRow.next();
                                        nextRow.prepend($("<td class='inserted'></td>"));
                                    }

                                    currentCell.attr("rowspan", 0);
                                });

                            drawing.drawDOM("#scheduler .k-scheduler-content",
                                {
                                    paperSize: "Letter",
                                    margin: "2cm",
                                    scale: 0.9
                                })
                                .then(function(group) {
                                    drawing.pdf.saveAs(group, "My_School_Year_Calendars.pdf");
                                    var scheduler = $("#scheduler").getKendoScheduler();
                                    scheduler.view(scheduler.view().name);
                                });
                        },

  5. Peter Milchev
    Admin
    Peter Milchev avatar
    144 posts

    Posted 28 Sep Link to this post

    Hello Robert,

    I am afraid that the provided Dojo example is a custom solution you could use as a starting point but it is a task for the developer to implement it, ensuring that it works correctly in all cases. Since this functionality is not available out-of-the-box if you need further assistance, and/or consulting, please note that this falls out of the scope of our support service, and is in the scope of the Telerik Professional Services. I can recommend checking them out for custom-tailored solutions, assessments, trainings, and partial or full-scaled project development.

    Let me know if you are interested, and I will arrange for someone from the team to contact you.

    Regards,
    Peter Milchev
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
Back to Top
Kendo UI is VS 2017 Ready