Print View open new window

Last post 07-09-2008 1:51 AM by Lance Zhang - MSFT. 2 replies.

Sort Posts:

  • Print View open new window

    07-06-2008, 6:58 PM

    Hello, I have the code below in my master page header. I have a "Printer Friendly" link.  What would I need to do so a new window will open when user clicks the "Printer Friendly" link applying the "print.css"?? 

     Thanks Steve

    <link rel="stylesheet" media="screen" type="text/css" href="screen.css" />

    <link rel="stylesheet" media="print" type="text/css" href="print.css" />

     

     

     

  • Re: Print View open new window

    07-07-2008, 5:40 AM

     here is only one way to print selected html to print


    function getPrint(print_area)
            {   
                //Creating new page
                //var pp = window.open('','MenuAlaCarte','fullscreen=1,scrollbars=1');
                var pp = window.open('','MenuAlaCarte','height=1024,width=1024,alwaysLowered=0,alwaysRaised=0,channelmode=0,dependent=0,directories=0,fullscreen=1,hotkeys=1,location=0,menubar=0,resizable=1,scrollbars=1,status=0,titlebar=1,toolbar=0,z-lock=0');
               
                //Adding HTML opening tag with <HEAD> … </HEAD> portion
                pp.document.writeln('<HTML><HEAD><link rel="stylesheet" type="text/css" href="style/style.css" /><title>Print Preview</title><LINK href=Styles.css  type="text/css" rel="stylesheet">')
                pp.document.writeln('<LINK href=PrintStyle.css  type="text/css" rel="stylesheet" media="print"><base target="_self"></HEAD>')
                //Adding Body Tag
                pp.document.writeln('<body MS_POSITIONING="GridLayout" bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0">');
                //Adding form Tag
                pp.document.writeln('<form  method="post">');
                //Creating two buttons Print and Close within a table
                pp.document.writeln('<TABLE width=100%><TR><TD></TD></TR><TR><TD align=right><INPUT ID="PRINT" type="button" class="button2" value="Print" onclick="javascript:location.reload(true);window.print();"><INPUT ID="CLOSE" type="button" class="button2" value="Close" onclick="window.close();"></TD></TR><TR><TD></TD></TR></TABLE>');
                //Writing print area of the calling page
                pp.document.writeln(document.getElementById(print_area).innerHTML);
                //Ending Tag of </form>, </body> and </HTML>
               
                pp.document.writeln('</form></body></HTML>');           
    //            pp.document.writeln('<script language="javascript" type="text/javascript">');
    //            pp.document.writeln('function Print(){');
    //            pp.document.writeln('    window.print();');
    //        //    pp.document.writeln('window.close();');
    //            pp.document.writeln('        }Print();</script> ');
                return false;
            }       

     on click of print button u  call the getPrint(print_area) function with one parameter (Id of DIV)

    View Blog For Latest Updates
    My Blog http://www.center4code.blogspot.com/

    Don't forget to click “Mark as Answer” on the post that helped you
  • Re: Print View open new window

    07-09-2008, 1:51 AM
    Answer
    Hi Steve
     
    sameer_khanjit’s code is good; it can print the DIV which you need be printed only.
    Otherwise, If you want to control the print effect by CSS, the following demo from:
    http://blog.csdn.net/net_lover/archive/2004/07/06/35228.aspx
    May be helpful: 
    <style>
    @media print{
    INPUT {display:none}
    }
    </style>
    <TABLE border="0" style="font-size:9pt;" width="300px" align="center">
    <THEAD style="display:table-header-group;font-weight:bold">
    <TR><TD colspan="2" align="center" style="font-weight:bold;border:3px double red">Table Header</TD></TR>
    </THEAD>
    <TBODY style="text-align:center"">
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR style="page-break-after:always;"><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR style="page-break-after:always;"><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR><TD>content</TD><TD>content</TD></TR>
    <TR style="page-break-after:always;"><TD>content</TD><TD>content</TD></TR>
    </TBODY>
    <TFOOT style="display:table-footer-group;font-weight:bold">
    <TR>
    <TD colspan="2" align="center" style="font-weight:bold;border:3px double blue">Table Root</TD>
    </TR>
    </TFOOT>
    </TABLE>
    <input type=button value="print" onclick="window.print()">
     
     
    If I’ve misunderstood your problem, please feel free to let me know.
     
    Thanks.

     

    Sincerely,
    Lance Zhang
    Microsoft Online Community Support

    Please remember to click “Mark as Answer” on the post that helps you. This can be beneficial to other community members reading the thread.
Page 1 of 1 (3 items)
Microsoft Communities
Page view counter