How can this JavaScript print problem be fixed?

October 7, 2008 6:09 PM

After invoking window.print, is there a way to make JavaScript wait for the user to return from the print dialog screens? I'm using jQuery to hide a series of items, print the page, and then show the items that were hidden before. Unfortunately, execution continues after window.print() is called, while the user is in the print dialog screens. As a result, items that were hidden are showing up before the printing occurs.

Print stylesheets would perfect for this, but unfortunately there are multiple ways a user can choose to print a page.

Here is my function:

$("#printShortPage").click(function(){
// hide all elements with hide_print_short class
$('.hide_short_print').hide();

window.print();

/*** I need to "pause" here ***/

// show elements that were hidden above
$('.hide_short_print').show();

});

posted by hitopshelf to computers & internet (3 comments total)

Why don't you use a printer css file?

Put this in your head:

link href="print.css" rel="stylesheet" media="print" type="text/css"

then, make print.css be:

.hide_short_print { visibility: hidden; }

The user's browser will "hide" these items on the printed page, but keep them visible.
posted by profwhat at 7:00 PM on October 7, 2008

Why do you need to hide these items?
posted by mandal at 7:19 PM on October 7, 2008

seconding the print css file, if you're careful with your layouts and classes and ids, you can pull out pretty niftily printed pages (and save yourself jQuery work)
posted by _dario at 8:47 PM on October 7, 2008