Open hidden sections before printing

[CharlieLaw]

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.

[Twey]

<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.

[CharlieLaw]

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.

[CharlieLaw]

Got it mate,

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

Cheers
Charlie.

[Twey]

Heh, no problem.