JavaScript Print Function: Printing an External Page?

Discussion in 'HTML & Website Design' started by webgaya, Dec 11, 2007.

  1. #1
    I have two pages in the same folder: index.html and print.html.
    print.html contains a button which calls a JavaScript function.
    When calling this function, I want to print index.html. Can I achieve this?
    I tried it and couldn't get it done. The code I tried is as below.

    print.html

    
    <html>
    <head>
    <script type="text/javascript">
    function printExternal() {
    	printWindow = new Object();
    	printWindow.window.location = "index.html";
    	printWindow.window.print();
    }
    </script>
    </head>
    <body>
    <form>
    <input type="button" name="print" value="Print" onclick="printExternal();" />
    </form>
    </body>
    </html>
    
    HTML:
    index.html
    
    <html>
    <body>
    <h1>Print Test!</h1>
    </body>
    </html>
    
    HTML:
    Thanks.
     
    webgaya, Dec 11, 2007 IP
  2. AstarothSolutions

    AstarothSolutions Peon

    Messages:
    2,680
    Likes Received:
    77
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Why are you having 2 pages? If it is to only print certain parts ect then you should use CSS to do this correctly rather than having two files
     
    AstarothSolutions, Dec 11, 2007 IP
  3. webgaya

    webgaya Active Member

    Messages:
    132
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    53
    #3
    Hi AstarothSolutions,

    That's what I want, how can I print a certain part using
    CSS and JavaScript?

    Say I have a div class around H1 as below,

    
    <html>
    <body>
    <div class="print">
    <h1>Print Test!</h1>
    </div>
    <p>I don't want to print this paragraph</p>
    </body>
    </html>
    
    HTML:
    Can you tell me how to print only the content of this div class?

    Thanks.
     
    webgaya, Dec 11, 2007 IP
  4. AstarothSolutions

    AstarothSolutions Peon

    Messages:
    2,680
    Likes Received:
    77
    Best Answers:
    0
    Trophy Points:
    0
    #4
    You dont use javascript to do the hidding only the actual calling the print job.

    You need to have 2 CSS files one for display and the other for print - naturally for print you hide all the unwanted divs and repossition the desired div. on the page header you just need to add the media attribute to define which is display and which is print....
    http://www.w3schools.com/css/css_mediatypes.asp
     
    AstarothSolutions, Dec 12, 2007 IP