1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Print Button, HTML

Discussion in 'HTML, Graphics & Programming' started by Jamauk, 9 Jun 2006.

  1. Jamauk

    Wise Guy

    Joined: 16 Mar 2004

    Posts: 1,827

    Location: Oxford

    I'm trying to add a print button to a web page that only prints one section of the page. The section that needs printing is an inline frame (I1) however I can only get it to print out the whole page. Here is the code I have so far:

    Code:
    <form><input type="button" value="Print"
    onclick="window.print();return false;" /></form> 
    What do I need to change to get it to work? Any help would be appreciated.
     
  2. toosepin

    Hitman

    Joined: 9 Jun 2006

    Posts: 954

    Location: Manchester

    This one works for me:

    Code:
    <script language="javascript">
    var message = "Print";
    function printit() {
    window.print();  
    }
    document.write("<form><input type=button "
    +"value=\""+message+"\" onClick=\"printit()\"></form>");
    </script>
    
    
     
  3. Jamauk

    Wise Guy

    Joined: 16 Mar 2004

    Posts: 1,827

    Location: Oxford

    I tried that code and although it prints the page it doesn't just print the inline frame which is what I'm totally stuck on.
     
  4. Al Vallario

    Mobster

    Joined: 3 Aug 2005

    Posts: 4,534

    Location: UK

    Code:
    <form><input type="button" value="Print"
    onclick="[b]parent[/b].[b]framename[/b].print()" /></form>
    That should work :)
     
  5. Jamauk

    Wise Guy

    Joined: 16 Mar 2004

    Posts: 1,827

    Location: Oxford

    I've tried that and for some reason it doesn't, I've just thought of a few things I have not mentioned;

    The print button is to be displayed in the main area of the page, the inline frame is within the main page and displays a text file which is what I want to be able to print on its own.

    The inline frame is called I1.

    Hope this makes sense, I just have no idea how to do this.
     
  6. |Ric|

    Hitman

    Joined: 28 Jun 2005

    Posts: 895

    I haven't fiddled with this stuff for a while but I think you need to give the IFRAME focus first.
    Code:
    <script>
    function printIFrame()
    {
    	parent.I1.focus();
    	parent.I1.print();
    }
    </script>
    
    <form><input type="button" value="Print" onclick="printIFrame" /></form>
     
  7. Jamauk

    Wise Guy

    Joined: 16 Mar 2004

    Posts: 1,827

    Location: Oxford

    Thanks, it works, I wondered about giving the Iframe focus as its what I had read about it when googling on the topic, however I couldn't work out what code was required to do this.