Closing a print ready page.

[createErrorMsg]

I am relatively new to webmasterworld. I've spent the last few days checking things out and watching responses (even made a few myself) and I am really encouraged by all the great, helpful advice I've seen. You folks really know your stuff!

So I have a problem I'd like to present.

I have a page which is generated by javascript in response to user form input. There is a link to print this page if the user wants. In an effort to avoid printing the non-essentials, I set up a function to pull out the essential content (contained in the generated code inside a <div id="printable">), write it to a new window, and call the window.print() function.

All of this works fine and dandy. I then added a window.close() (actually it's printWin.close()) in order to save the user the trouble of having to close the print window.

Running from my hard drive, this, too, works fine. The print window opens, fills with the right content, calls up the print dialog, and closes down the print window. But if I put it online, it's a whole different story. It opens the print window, then closes it before the print dialog ever opens.

Any thoughts? I'd appreciate any response I can get.

[Rambo Tribble]

Just guessing here, but I imagine the delay imposed by the browser checking the server to see if the objects, such as images, included in the print window have been modified is allowing the window.close() to execute prematurely.

Instead of building a separate print window, you might try a CSS @media rule to print just the parts you want.

[createErrorMsg]

Rambo,

I'm not familiar with the @media rule. Can you point me to any good, reliable CSS resources that might have info on it?

[Rambo Tribble]

There are probably some online you could find, but I like Eric Meyer's book Cascading Style Sheets 2.0. I bet someone will chime in soon with more offerings, but I'm headed to work.

[Bernard Marx]

@media is the thing here... and cut'n'paste "@media rule" into Google would be a good bet.
Oh hang on, I've saved you the trouble :)

[w3.org ]

[createErrorMsg]

I may need to move this discussion over to the CSS section, but I see many of the same names here as I see over there, so one little CSS question and if it gets too hairy I'll high-tail it to CSS-land...

If I get this right (thank you, Bernard, for the link), @media is a way to specify CSS styles that apply only to the page as a peice of the specified media (in this case as a printed document). So when the browser goes to print the page, it will send it to the printer using the @media print styles?

If that is the case, I would need to use CSS to get rid of the un-wanted parts of the page (the nav bar, for instance).

I'm thinking of display:none or visibility:none.

Sound right?

[Bernard Marx]

Sounds good to me. visibility ¦¦display is a matter of choice. The one still takes space, the other doesn't. Of course, you don't need completely separate style definitions for screen & print (I know, you already know that) - I can't recall what the exact rules of precedence are. I'm sure they'll tell you when you get to that other place.

Say 'hello' from over here.

[Purple Martin]

I agree that CSS is the best way to hide non-essentials when printing.

However, since this was a JavaScript question in a JavaScript forum, I'll give you a JavaScript solution.
Delay the window.close() using the setTimeout function, like this:

setTimeout("window.close()",1000); // Hint: 1000 = 1 second, adjust this if you need to.

[createErrorMsg]

I tried the CSS method and actually like it much better than javascript. All those new windows popping up and then disappearing...makes it look like I don't know what what I'm doing. (Looks can be deceiving. In this case they aren't, but they can be.)
I'm adding the setTimeout in my notes, though, for possible use in the future.
Thanks for your help.