简体   繁体   中英

Print Iframe with PDF generated on the fly IE 11

I wanted to print a pdf which is generated on the fly in an Iframe, but can't get that print this pdf file. This is what i have now, am i doing something wrong?. Works fine on Google Chrome but not on IE 11. Please help me to get this work. 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 the src of the iframme with the dynamic URL (this url generates the 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 is where i try to print

document.getElementById('contractIframe').focus();
document.getElementById('contractIframe').contentWindow.print();

On IE 11 this send me the error "Invalid calling object"

I tried this too without success:

window.frames["contractIframe"].focus();
window.frames["contractIframe"].print();

My workaround was generate the pdf first (save into disk) and then use the url of the generated and place it into an <embed> object (with this you are able to 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 file into disk) and use 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 place this:

document.getElementById('pdf2').contentWindow.print();

Hope this helps someone else

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM