24

I have an iframe which needs point directly to a PDF file (not a page with a PDF):

<iframe id="ecard-pdf" name="ecard-pdf" style="position: absolute;" src="/profile.pdf">
</iframe>

I want to be able to print the PDF in this iFrame

I have found several solutions in other questions that do not fit my needs:

  1. Require to have a function in the iframe ( https://stackoverflow.com/a/473270/1246369 )
  2. Suggest focusing the frame and then performing print action on it ( https://stackoverflow.com/a/9616706/1246369 )
  3. Access contentWindow of the iframe and print it ( https://stackoverflow.com/a/9617566/1246369 )
  4. Variations of those

However, it seems that FireFox and IE can't do this if the iframe's src points directly to a PDF and not to a page wrapped around the PDF.

Firefox:

Instead of printing, it displays this dialog: "Prevent this page from creating additional dialogues" with "OK" and "Cancel" buttons, neither of which prints the PDF.

IE:

just ignores my attempts to print using the above methods.

Question:

How can I allow users to print the PDF in the iFrame no matter what browser they are using?

Community
  • 1
  • 1
Asu
  • 1,723
  • 2
  • 21
  • 32
  • 8
    You could fight the browsers, or you could create an HTML wrapper page (e.g. `/printpdf.php?file=/profile.php`) and print that page instead. – N Rohler Dec 01 '12 at 04:20
  • 2
    You should check this [answer](http://stackoverflow.com/a/812345/792066), seems to get what are you trying working on IE and Firefox. – Braiam Jul 20 '13 at 21:38
  • you need to specify that the pdf is a file with src="file://..." – CMS_95 Nov 17 '13 at 21:42
  • 1
    @CS_STEM There's no evidence to suggest this is on the local file system, and even if it were, this question is a year old. – Daedalus Nov 17 '13 at 22:29
  • Just two questions.. do you have a PDF viewer in those browers? is there any probability the specified URL is not the correct one? you may use the absolute route 'http://domain.../document.pdf' – QuarK Dec 07 '13 at 00:55
  • 3
    @QuarK He asked this last year. – howderek Dec 08 '13 at 09:47
  • possible duplicate of [How do I print a pdf from within an iframe?](http://stackoverflow.com/questions/811272/how-do-i-print-a-pdf-from-within-an-iframe) – New Alexandria Dec 17 '13 at 17:15

6 Answers6

6

I have struggled a bit to find a solution that works for both IE and Chrome. This works for me:

$(function() {
    var ua = window.navigator.userAgent;
    var msie = ua.indexOf('MSIE ');
    var trident = ua.indexOf('Trident/');
    var edge = ua.indexOf('Edge/');
    var url = '/url/to/file.pdf';
    var pdf ='';
    var style = 'position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden;';

    if(msie > 0 || trident > 0 || edge > 0){
        pdf = '<object data="' + url + '" name="print_frame" id="print_frame" style="' + style + '" type="application/pdf">';
    }
    else{
        pdf ='<iframe src="' + url + '" name="print_frame" id="print_frame" style="' + style + '"></iframe>';
    }

    $(document.body).append(pdf);

    setTimeout(function(){
        window.frames["print_frame"].focus();
        window.frames["print_frame"].print();
    },2000);
});

...cheers.

Svela
  • 629
  • 5
  • 7
2

As suggested in this answer for a similar question, you could do this:

window.frames.pdfFrame.print();

This should solve your problem.

ZygD
  • 22,092
  • 39
  • 79
  • 102
bdadam
  • 233
  • 4
  • 9
0

Option 1:

I haven't tested this but I found another answer here: https://stackoverflow.com/a/4096547/2528978

Assuming that you could use the following:

<style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
</style>

So then just the pdf is displayed?

Option 2:

Make a hyperlink to the pdf file that says "Print me"

<a href='Path/To/PDF'>Print Me</a>

Hope this helps...

-Andrew

Community
  • 1
  • 1
acrawly
  • 443
  • 1
  • 6
  • 10
0

This seems to be working:

   <style type="text/css" media="print">
   body *{display:none}
   iframe{display:block}
   </style>

So then just the pdf is displayed?

Neutrino
  • 21
  • 7
-1
const target_iframe = $("#pdfViewerIframe")

target_iframe.attr("src", URL.createObjectURL(new Blob([resp], {
                                type: "application/pdf"
                            })))

target_iframe[0].contentWindow.print()

NOTE: resp is pdf you get from server

B001ᛦ
  • 2,036
  • 6
  • 23
  • 31
goshant meher
  • 7
  • 1
-2

You can use directly window print option. use onclick option

onclick="javascript:window.print();"

Imran khan
  • 819
  • 3
  • 12
  • 24