This is a migrated thread and some comments may be shown as answers.

Kendo UI JQuery PDFViewer print action prints all blank pages

1 Answer 825 Views
PDFViewer
This is a migrated thread and some comments may be shown as answers.
Barret
Top achievements
Rank 1
Barret asked on 01 Dec 2020, 07:19 PM

I'm using Kendo's JQuery PDFViewer control to display PDF files inline in a web page. The control is launched into a modal popup via a piece of JavaScript, thusly:

 

var launchPDFModal = function (param1, param2, param3) {
        var pdfViewer = $("#pdfViewer").data("kendoPDFViewer");
        if (!pdfViewer) {
            pdfViewer = $("#pdfViewer").kendoPDFViewer({
                pdfjsProcessing: {
                    file: ""                 },
                width: "100%",
                height: "85vh",
                toolbar: {
                    items: [
                        "pager", "zoom", "search", "download", "print"                     ]
                },
                messages: {
                    defaultFileName: param1
                }
            }).data("kendoPDFViewer");
        }
 
        var pdfHandlerUrl = "/api/pdfViewer/" + param1 + "/" + param2 + "/" + param3;
        pdfViewer.fromFile(pdfHandlerUrl);
 
        $("#pdfViewerModal").show();
    }

The three params are used to identify the file to be shown and file is returned as a stream as the files are stored in data and not as files on a drive. I have verified the references to the Kendo library, pdf.js and pdf.worker.js are all correct as required.

The PDF file loads and displays just fine in the control. The download button also successfully saves the file to the local drive. However, when I click the print button, and the print preview shows up, it has the correct number of pages, but they are all blank. Trying the actual print, just prints blank pages. Browser doesn't matter. I've tried Chrome, Edge, and Firefox. Same thing. I've also verified that it's not an ad blocker (neither Edge nor Firefox installs have any plugins on them).

1 Answer, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 03 Dec 2020, 02:05 PM

Hello Barret,

The fromFile method expects a url pointing to a file to be passed as a parameter.

Consider using the pdfjsProcessing.file.data option: https://docs.telerik.com/kendo-ui/api/javascript/ui/pdfviewer/configuration/pdfjsprocessing.file.data which allows passing blob, byte or base64 data to the PDFViewer. In your scenario, since the files are stored into a database, you can return the file data as a base64 string, which can then be passed to the PDFViewer's data option.

Regards,
Ivan Danchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
PDFViewer
Asked by
Barret
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or