Results 1 to 5 of 5

Thread: Open hidden sections before printing

  1. #1
    Join Date
    Mar 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Open hidden sections before printing

    I have set up a form which is very large in size, the objective of the form is for the user to fill it in and then print it off to post. To make it more usable I have used some JavaScript to show and hide sections. The user fills out one section, clicks next and the section they are on is hidden and the new section appears.

    Everything works great with this technique until it comes to printing at the end. I have a print button which when clicked shows all fields and prints fine, my probelm is what happens if the user does file/print in the browser window. Currently only the section they are on (the last page) will be shown. Is there any way to display all sections when the user selects the browser option to print or print preview.

    It has been suggested to me to use onbeforeprint event , however I need a cross browser solution.

    Thanks Charlie.

  2. #2
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Code:
    <style type="text/css">
      .hideable-hidden {
        display: none;
      }
    
    @media print {
      .hideable-hidden {
        display: inherit;
      }
    }
    </style>
    Then, use .className = "hideable-hidden" rather than .style.display = "none" to hide your elements, and .className = "" to unhide them.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  3. #3
    Join Date
    Mar 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for the reply Twey

    I have tried what you suggested, however I am still getting some issues which are similar as before. Instead of only showing the section I was on when I print, I now only get the sections I havent navigated past. e.g. if on section 5, sections 1-4 will not show but sections 5-7 will, which is annoying because I want the user to navigate to the end and then print, but none of the sections previous will be printed.

    I modified your suggestion slightly as I have double classes on some of the elements. What I done was to add hideable-hidden to all the divs I want to hide when the page loads using an addClass function. I then overwrote the element I wanted to show by feeding it the className = "form-block clearing" (standard class names used for each section), thus effectively I am just removing the class hideable-hidden as you suggested.

    Any thoughts
    Thanks Charlie.

  4. #4
    Join Date
    Mar 2006
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Got it mate,

    Thanks for the help. Turn out I had not removed the display:none from the code.

    Cheers
    Charlie.

  5. #5
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,878
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    Heh, no problem.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends franšais | entiendo espa˝ol | t˘i Ýt hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

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
  •