Using javascript -- in an iPad html5 web app, is it possible to print a pdf which is loaded in an iframe?

I have tried numerous things without success such as:

var iframe = document.getElementsByTagName('iframe')[0]

if (iframe.attachEvent) {
    iframe.attachEvent("onload", function(){
      console.log("Local iframe is now loaded.");
      iframe.contentWindow.print()
    });
}
else {
    iframe.onload = function(){
        console.log("sLocal iframe is now loaded.");
        iframe.contentWindow.print()
    };
}

The iframe's url is '/data/xyz.pdf';

The goal is for the airprint dialog to open. This is a major issue for me, please help!!!

Using javascript -- in an iPad html5 web app, is it possible to print a pdf which is loaded in an iframe?

I have tried numerous things without success such as:

var iframe = document.getElementsByTagName('iframe')[0]

if (iframe.attachEvent) {
    iframe.attachEvent("onload", function(){
      console.log("Local iframe is now loaded.");
      iframe.contentWindow.print()
    });
}
else {
    iframe.onload = function(){
        console.log("sLocal iframe is now loaded.");
        iframe.contentWindow.print()
    };
}

The iframe's url is '/data/xyz.pdf';

The goal is for the airprint dialog to open. This is a major issue for me, please help!!!

• javascript
• ipad
• iframe
• printing

• The user will only be using iPad's safari. And it's ok if it only works in safari. – Brian McGinity Commented Aug 19, 2014 at 19:24
• The browser shows the pdf in the iframe. You can see the pdf just fine. – Brian McGinity Commented Aug 20, 2014 at 11:16
• Sorry read the question wrong, was seeing it as just showing the pdf in browser and not printing it – Patrick Evans Commented Aug 20, 2014 at 11:43

3 Answers 3

I think you are nearly get the solution. The only left is just how you print the iframe. Try to use this.

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

Hope it helps :)

A different way to the other two answers is to use CSS to print only the iframe:

@media print {
    * {
        display: none;
    }

    iframe {
        display: block;
        width: 100%;
        height: 100%;
    }
}

This basically makes the iframe the full width and height of the page, and hides other elements, so that the iframe is the only thing in view when the user clicks print. The advantage over the other options is that it will work with JavaScript turned off, which some users may have done for security reasons.

I'm pretty confident about safari supporting PDFObject. It's just an object to declare, pretty easy to use.

Even if not exactly an iframe, you can use a div this way :

<div id="pdfIframe"></div>

var pdf = new PDFObject({
  url: "/data/xyz.pdf",
  id: "pdfRendered",
  pdfOpenParams: {
    view: "FitH"
  }
}).embed("pdfIframe");

Source : http://pdfobject./

EDIT : I did not see it was a printing issue, so my answer isn't really one. BTW, i remember a friend using it, he had no problem to print it, so maybe there is an included printing support function.