Take the 2-minute tour ×

I need to print whole content of a div. Notice scroll in the div. But when I use Window.print() to print its content, it prints only the visible part on the screen. I want to print all 154 records in the grid, but it prints only 21 records.

enter image description here

Note: I don't want to open a new window.


javascript function()
1. Hide divs that you don't want to print
2. window.print()
3. show the divs you hide in step 1
share|improve this question
Sorry, I can't help you if you don't help-me with some codes. –  Gabriel Santos Jul 5 '12 at 7:30
@vaibhav, use this jquery plugin http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/ –  Furqan Jul 5 '12 at 7:33
See edit for the logic I am using. –  Vaibhav Jain Jul 5 '12 at 7:35

4 Answers 4

The strongest solution I think is to create an iframe, copy the contents to be printed to that frame, then print it. There are JQuery plugins for this. Duplicate: Print the contents of a DIV

Another possibility is to have a print CSS that hides the stuff that you don't want to print (menus etc.), and also removes the min-height on your table, causing the scrollbar to be removed.

share|improve this answer

Use style sheet with a media type of print.


And change the DIV style:

height:auto; overflow:auto

so when printing (window.print()) the div will increase in height.

... and hide all the other DIVs in the print.css

share|improve this answer

Try this, But first include this library



Read this article on Div Printing

share|improve this answer
printElement()..Do I need to use some lib for this? –  Vaibhav Jain Jul 5 '12 at 7:37
It's a jquery plugin. –  Rasmus Franke Jul 5 '12 at 7:38
@vaibhav. yes, i updated the answer –  Talha Jul 5 '12 at 7:39


I wrote the above plugin based on several others, that allows for printing of an element on a page (no popup) and maintaining page styles or loading new css styles specifically for the print element.

share|improve this answer

Your Answer


