How can I pop-up a print dialog box using Javascript

Question

I have a page with a  Print  link that takes the user to a printer-friendly page   The client wants a print dialog box to appear automatically when the user arrives at the print-friendly page   How can I do this with javascript

User · Answer

If you just have a link without a click event handler    lt a href  javascript window print     gt Print Page lt  a gt

User · Answer

You could do   lt body onload  window print    gt       lt  body gt

User · Answer

You could do   lt body onload  window print    gt       lt  body gt

User · Answer

window print        unless you mean a custom looking popup

User · Answer

window print        unless you mean a custom looking popup

User · Answer

You could do   lt body onload  window print    gt       lt  body gt

User · Answer

I like this  so that you can add whatever fields you want and print it that way   function printPage         var w   window open         var headers        headers   html        var field      field1   html        var field2      field2   html         var html     lt  DOCTYPE HTML gt        html      lt html lang  en-us  gt        html      lt head gt  lt style gt  lt  style gt  lt  head gt        html      lt body gt           check to see if they are null so  undefined  doesnt print on the page   lt br gt s optional  just to give space     if headers    null  html    headers     lt br  gt  lt br  gt        if field    null  html    field     lt br  gt  lt br  gt        if field2    null  html    field2     lt br  gt  lt br  gt         html      lt  body gt        w document write html       w window print        w document close

User · Answer

I like this  so that you can add whatever fields you want and print it that way   function printPage         var w   window open         var headers        headers   html        var field      field1   html        var field2      field2   html         var html     lt  DOCTYPE HTML gt        html      lt html lang  en-us  gt        html      lt head gt  lt style gt  lt  style gt  lt  head gt        html      lt body gt           check to see if they are null so  undefined  doesnt print on the page   lt br gt s optional  just to give space     if headers    null  html    headers     lt br  gt  lt br  gt        if field    null  html    field     lt br  gt  lt br  gt        if field2    null  html    field2     lt br  gt  lt br  gt         html      lt  body gt        w document write html       w window print        w document close

User · Answer

I do this to make sure they remember to print landscape  which is necessary for a lot of pages on a lot of printers    lt a href  javascript alert  Please be sure to set your printer to Landscape    window print     gt Print Me    lt  a gt    or    lt body onload  alert  Please be sure to set your printer to Landscape    window print     gt  etc   lt  body gt

User · Answer

window print        unless you mean a custom looking popup

User · Answer

if problem    mywindow print      altenative using      lt scr   ipt gt print   lt  scr   ipt gt     Full        print-ticket   click function             var body      body   html            var ticket area     lt aside class  widget tickets  gt         widget tickets   html       lt  aside gt                body   html ticket area           var print html     lt html lang  tr  gt        html   html       lt scr   ipt gt print   lt  scr   ipt gt       lt  html gt                body   html body            var mywindow   window open      my div    height 600 width 800            mywindow document write print html           mywindow document close       necessary for IE  gt   10  lt  html gt           mywindow focus       necessary for IE  gt   10           mywindow print            mywindow close             return true

User · Answer

You can tie it to button or on load of the page   window print

User · Answer

If you just have a link without a click event handler    lt a href  javascript window print     gt Print Page lt  a gt

User · Answer

I do this to make sure they remember to print landscape  which is necessary for a lot of pages on a lot of printers    lt a href  javascript alert  Please be sure to set your printer to Landscape    window print     gt Print Me    lt  a gt    or    lt body onload  alert  Please be sure to set your printer to Landscape    window print     gt  etc   lt  body gt

User · Answer

window print        unless you mean a custom looking popup

User · Answer

You could do   lt body onload  window print    gt       lt  body gt

User · Answer

if problem    mywindow print      altenative using      lt scr   ipt gt print   lt  scr   ipt gt     Full        print-ticket   click function             var body      body   html            var ticket area     lt aside class  widget tickets  gt         widget tickets   html       lt  aside gt                body   html ticket area           var print html     lt html lang  tr  gt        html   html       lt scr   ipt gt print   lt  scr   ipt gt       lt  html gt                body   html body            var mywindow   window open      my div    height 600 width 800            mywindow document write print html           mywindow document close       necessary for IE  gt   10  lt  html gt           mywindow focus       necessary for IE  gt   10           mywindow print            mywindow close             return true

User · Answer

You can tie it to button or on load of the page   window print

User · Answer

I do this to make sure they remember to print landscape  which is necessary for a lot of pages on a lot of printers    lt a href  javascript alert  Please be sure to set your printer to Landscape    window print     gt Print Me    lt  a gt    or    lt body onload  alert  Please be sure to set your printer to Landscape    window print     gt  etc   lt  body gt

User · Answer

I know the answer has already been provided  But I just wanted to elaborate with regards to doing this in a Blazor app  razor      You will need to inject IJSRuntime  in order to perform JSInterop  running javascript functions from C    IN YOUR RAZOR PAGE     inject IJSRuntime JSRuntime   Once you have that injected  create a button with a click event that calls a C  method     lt MatFAB Icon   MatIconNames Print  OnClick    async      gt  await print     gt  lt  MatFAB gt     or something more simple if you don t use MatBlazor    lt button  onclick    async      gt  await print     gt PRINT lt  button gt    For the C  method    public async Task print         await JSRuntime InvokeVoidAsync  printDocument        NOW IN YOUR index html     lt script gt      function printDocument             window print           lt  script gt    Something to note  the reason the onclick events are asynchronous is because IJSRuntime awaits it s calls such as InvokeVoidAsync   PS  If you wanted to message box in asp net core for instance    await JSRuntime InvokeAsync lt string gt   alert    Hello user  this is the message box      To have a confirm message box    bool question   await JSRuntime InvokeAsync lt bool gt   confirm    Are you sure you want to do this         if question    true                  user clicked yes           else                 user clicked no         Hope this helps

User · Answer

I do this to make sure they remember to print landscape  which is necessary for a lot of pages on a lot of printers    lt a href  javascript alert  Please be sure to set your printer to Landscape    window print     gt Print Me    lt  a gt    or    lt body onload  alert  Please be sure to set your printer to Landscape    window print     gt  etc   lt  body gt

User · Answer

I know the answer has already been provided  But I just wanted to elaborate with regards to doing this in a Blazor app  razor      You will need to inject IJSRuntime  in order to perform JSInterop  running javascript functions from C    IN YOUR RAZOR PAGE     inject IJSRuntime JSRuntime   Once you have that injected  create a button with a click event that calls a C  method     lt MatFAB Icon   MatIconNames Print  OnClick    async      gt  await print     gt  lt  MatFAB gt     or something more simple if you don t use MatBlazor    lt button  onclick    async      gt  await print     gt PRINT lt  button gt    For the C  method    public async Task print         await JSRuntime InvokeVoidAsync  printDocument        NOW IN YOUR index html     lt script gt      function printDocument             window print           lt  script gt    Something to note  the reason the onclick events are asynchronous is because IJSRuntime awaits it s calls such as InvokeVoidAsync   PS  If you wanted to message box in asp net core for instance    await JSRuntime InvokeAsync lt string gt   alert    Hello user  this is the message box      To have a confirm message box    bool question   await JSRuntime InvokeAsync lt bool gt   confirm    Are you sure you want to do this         if question    true                  user clicked yes           else                 user clicked no         Hope this helps

[javascript] How can I pop-up a print dialog box using Javascript?

Examples related to javascript