SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: Print this form

  1. #1
    a fresh, new start... dujmovicv's Avatar
    Join Date
    Aug 2006
    Location
    Earth
    Posts
    559
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Print this form

    Hi, I'm not really good in JS... I need to add a button to print some section of the page. I don't want to print the whole page, just a form. How can I do this?

  2. #2
    He's No Good To Me Dead silver trophybronze trophy stymiee's Avatar
    Join Date
    Feb 2003
    Location
    Slave I
    Posts
    23,449
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    You'll need CSS to handle this: http://alistapart.com/articles/goingtoprint/

  3. #3
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can also open a new window, put the content of the form into it and then display the print dialog.

    Css is probably the best way but if someone wants to print the whole page then they would only get the form.

    Obviously there is a bit work that needs doing to remove elements you don't want to print but thats easy if you assign id's, you can simply use

    Code:
    nwin.document.write(form.innerHTML);
    nwin.document.getElementById('elementId').sytle.display = 'none'
    The Code:
    Code:
    <html>
    <head>
    <title>Test</title>
    <script>
    function printForm(id)
    {
    	var form = document.getElementById(id);
    	var nwin = window.open('',null);
    	nwin.document.write(form.innerHTML);
    	nwin.print();
    }
    </script>
    </head>
    <body>
    
    <form id="testForm">
    
    1: <input /><br />
    2: <input /><br />
    3: <input /><br />
    <br />
    etc
    <input type="submit" /><br />
    <input type="button" value="Print Form" onclick="printForm('testForm');" />
    </form>
    
    </body>
    </html>



Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •