ExportToPdf works local, not production.

3 posts, 1 answers
  1. Bill
    Bill avatar
    25 posts
    Member since:
    Mar 2019

    Posted 27 Oct 2019 Link to this post

    My project is core but this is really just simple view.  I want to convert some simple html to pdf and "Save As" to the local machine.   I dumbed down my actual view fo the example but please help me understand why this works (pdf is generated and saved to downloads) on my local machine but not in production (tried in Chrome/Edge/IE).

    Heres a dojo link;  http://dojo.telerik.com/@bdaun1@gmail.com/  (doesn't work here either... only when I run in dev on my machine)

     

    Thanks!

    BD

     

    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
        <div class="box wide hidden-on-narrow">
            <div class="box-col">
                <button class="export-pdf k-button" onclick="getPDF()">ExportToPDF</button>
            </div>
        </div>
        <div class="page-container hidden-on-narrow">
            <div class="pdf-page">
                <div class="pdf-header">
                    <span class="company-logo"></span>
                </div>
                <div class="pdf-body">
                    <div class="container">
                        <div class="row">
                            <div class="col-sm-8">
                                <p>Test Area1</p>
                            </div>
                            <div class="col-sm-12">
                                <hr />
                                <h3>Purpose Statement</h3>
                                <p>Test Area2</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
     
        <script>
            function getPDF() {
                kendo.drawing.drawDOM($('.pdf-page')).then(function (group) {
                    kendo.drawing.pdf.saveAs(group, "OrgOverview.pdf");
                });
            }
        </script>
     
        <style>
            .pdf-page {
                position: relative;
                margin: 0 auto;
                padding: .4in .3in;
                color: #333;
                background-color: #fff;
                box-shadow: 0 5px 10px 0 rgba(0,0,0,.3);
                box-sizing: border-box;
                font-family: "DejaVu Sans", "Arial", sans-serif;
            }
     
            .pdf-header {
                padding-bottom: .2in;
                margin-bottom: .3in;
                border-bottom: 1px solid #e5e5e5;
            }
        </style>
    </body>
    </html>
  2. Answer
    Nikolay
    Admin
    Nikolay  avatar
    251 posts

    Posted 30 Oct 2019 Link to this post

    Hi Bill,

    Thank you for sharing information about your scenario. 

    I just tested the provided code snippet and it works as expected in both an ASP.NET Core project and a Dojo environment.

    The reason for the described behavior is most likely related with the environment setup. Are you loading all script correctly and are there any errors in the console of the browser? Are you able to reproduce the issue using the Kendo UI CDN?

    In case the issue remains please get back to me providing more information so I can further investigate.

    Regards,
    Nikolay
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Bill
    Bill avatar
    25 posts
    Member since:
    Mar 2019

    Posted 30 Oct 2019 in reply to Nikolay Link to this post

    You were right.   It was a stylesheet reference issue.  Thanks for the quick response and hint to solve the issue.

    BD

Back to Top