I have a screen that I'm manually calling the print functionality of the kendo-pdfviewer from a button click. It is working, but the problem is that the resulting print dialog window is really small. Even if I open the print dialog, resize the dialog, and then try to print again it gets reset to the original small size. This is preventing our users from previewing what the resulting page will print like.
This is the code for my pdf viewer
<div class="row">
<div class="col">
<div id="example">
<kendo-pdfviewer name="pdfviewer" height="300">
<pdfjs-processing file="@(Url.Page("/Badges/Details", "VisitorBadge", new { BadgeId = @Model.Id }))" />
<toolbar enabled="false">
<pdfviewer-toolbar-items>
<pdfviewer-toolbar-item command="PrintCommand" type="button" name="print" icon="print"></pdfviewer-toolbar-item>
</pdfviewer-toolbar-items>
</toolbar>
</kendo-pdfviewer>
</div>
<style>
html body #pdfviewer {
width: 100% !important;
}
</style>
</div>
</div>
This is the javascript used to open the print dialog
badgereport.onWindowOpen = function () {
$pdfviewer = $("#pdfviewer").data("kendoPDFViewer");
$printBadgePdf = $("#printBadgePdf");
$closeBadgePdf = $("#closeBadgePdf");
$badgeWindow = $("#badgeWindow").data("kendoWindow");
$printBadgePdf.on("click", function (e) {
e.preventDefault();
$pdfviewer.execute({ command: "PrintCommand" });
});
$closeBadgePdf.on("click", function (e) {
e.preventDefault();
$badgeWindow.close();
});
};