Printing an Iframe with PDF generated on the fly IE 11
I wanted to print a pdf that is generated on the fly in an iframe, but cannot print this pdf. This is what I have now, am I doing something wrong? Works fine on Google Chrome but not IE 11. Please help me get this working. thanks in advance
this is the HTML markup
<div id="contractFrameContainer" class="modal-body row">
<iframe id="contractIframe" name="contractIframe" width="100%" src=""></iframe>
</div>
Here is my javascript where I assign src
iframme to dynamic url (this url generates pdf)
var url = currentUrl + '/contracts/createpdf?ProductId=' + Id + '&type='
+ Type + '&term=' + Term
+ '&deductible=' + Deductible
+ '&key=' + OrderNumber
+ '&financedAmount=' + financedAmount
+ '&downpayment=' + downpayment
+ '&apr=' + apr
+ '&tire=' + tireRotation
+ '&interval=' + interval
+ '&salesPrice=' + salesPrice
+ '&dealerCost=' + DealerCost
+ '&mileage=' + Mileage
+ '&serviceDate=' + serviceDate
+ '&penSurcharges=' + penSurcharges
+ '&price=' + Price;
var iframe = document.getElementById("contractIframe");
iframe.height = heightBody;
iframe.src = url;
And finally, here's where I try to print
document.getElementById('contractIframe').focus();
document.getElementById('contractIframe').contentWindow.print();
In IE 11 send me the error "Invalid caller"
I tried this too:
window.frames["contractIframe"].focus();
window.frames["contractIframe"].print();
source to share
My workaround first generated the PDF (save disk space) and then used the generated url and put it in an object <embed>
(with this you can use the print method from IE)
var ua = window.navigator.userAgent,
msie = ua.indexOf("MSIE "),
obj = null;
// Generate the embed object for IE
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) {
obj = document.createElement('embed');
obj.setAttribute("type", "application/pdf");
obj.setAttribute("id", "pdf1");
obj.style.width = '100%';
obj.height = heightBody + 'px';
obj.setAttribute("src", url); // here set the url for generated pdf file
}
// Place this where you print the embed (button, link...)
if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) {
document.getElementById('pdf1').print();
}
For other browsers like Chrome you can use the same approach (save the file to disk) and use an iframe (this works)
obj = document.createElement('iframe');
obj.setAttribute("type", "application/pdf");
obj.setAttribute('id', 'pdf2');
obj.setAttribute('src', url);
obj.style.width = '100%';
obj.height = heightBody + 'px';
In the print button you can put this:
document.getElementById('pdf2').contentWindow.print();
Hope this helps someone else.
source to share