Printing from javascript

Question

I have a page that displays search results. I'm looking for a way to have those search results printed. However, there are some items (ads, menus, etc) that should not be printed.

What I have so far is the results are sent to a new tab (using javascript) with the search results. All of the items that shouldn't be visible have been removed. However, only the text shows up. All the CSS styles and images aren't showing up.

Since the results are already being displayed, I'm trying to avoid having the server execute the search again.

Another thing to keep in mind, this is an SPA site(i.e. the URL never changes throughout the site).

My guess is since the html is getting sent to a new tab, the root URL is not set. So when it comes to a relative path for the images, css and script files, it doesn't know how to build the full path.

Does anyone know of a way to get this method to work? I know I can get this to work by having the server execute the search again, but I'm trying to see if there's a client side solution.

Thanks!

Answer 1

Using JavaScript to send the output to another tab is probably the source of your bug, and totally unnecessary. In your css for the page:

@media screen {
    .menu {display : block;}
}
@media print {
    .menu {display : none;}
}

will do the job.