Friday, January 15, 2010

Javascript Open Child Window and print

 Open a child window, load with dhtml/arbitrary html, or url and then have it open the print dialog. I tested in IE8,Fire Fox 3.5.7,Chrome 3.0.195.38, Safari (4 public beta) for windows.

After running into some frustration that the print() wasn't being fired I ran across a post where the child window must be reloaded...viola...thank you internet.
 <html>
   <head>
      <script type="text/javascript" language="javascript">
         function printdiv()
{
    try
    {
               var childWindow = window.open("about:blank", "_blank", "height=800,left=100,top=100,width=800,resize=yes,toolbar=yes,titlebar=0,status=0,menubar=yes,location= no,scrollbars=1"); 
        var headstr = "<html><head><title>Print Window</title></head><body>";
                var footstr = "</body>";
                var printData = document.getElementById("divPrint").innerHTML;
                if (printData == null || printData == "")                                       
                    printData = "Oops, there appears to be no data.";              
                childWindow.document.write(headstr + printData + footstr);
                childWindow.location.reload(false);     
                childWindow.print();
           }
           catch (e)
           {
              alert("It appears that your browser doesn't support print features." + e);
           }
           finally
           {
              return false;
           }
      }
      </script>
   </head>

   <body>
      <form id="form1" runat="server">
          <button onclick="return printdiv();" >Open child window and print</button> 
          <div id="divPrint" style="display:none;">I love life...but not like that</div>
      </form>
   </body>
</html>