faqts : Computers : Programming : Languages : JavaScript : Tables

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

11 of 32 people (34%) answered Yes
Recently 4 of 10 people (40%) answered Yes

Entry

How can I only print the contents of a table or scrollable table?
Could you provide some codes please? Thanks.
How can I print all rows of a scrollable tbl?(some rows are visible and some not until you scrolldwn
I use media=print & media=screen but it didn't work. It just prints rows that are visible on screen.

Jul 24th, 2002 14:22
Kady Ny, Jean-Bernard Valentaten, Raghavendra Samant, Rodney Hall,


Raghavendra Samant wrote:
> u cannot do so directly , but u can hide all other elements in the 
> screen and then print the page using window.print() and after print 
> make the visibility of other contents as " visible"
The idea is correct, but instead of writing some mega js code (and thus 
reinvent the wheel), simply use css. Write two css files with the same 
classes. One css-file will show all the tables etc, the other one will 
only show the content. Then use the first for media="screen" and the 
other for media="print"
HTH,
Jean
Ok, I'm gonna give you the <link>-tags, but if you need the css, change 
your job ;)
<link rel="stylesheet" media="screen" href="../css/screen.css" 
type="text/css">
<link rel="stylesheet" media="print" href="../css/print.css" 
type="text/css">
> ----------------------------------
> Thank you for your response and your <link> tags even though I 
> already used this tag in my code. You don't have to be mean like 
> that.
Sorry, I didn't mean it (you see the smiley at the end of the sentence)
> Besides, I'm a student who just starts to learn HTML, CSS and DHTML.
> So... I have those two tags in my script. I also created two 
> files "screen.css" and "print.css".  In print.css, I just simply 
> created a class such as
> .scrollableTbl {
>       font-size: 10pt
> }
In the print.css you need to set the visibility property to visible, 
otherwise the print-css will inherit from the screen-css:
.scrollableTbl {
    font-size: 10pt;
    visibility: visible;
}
That should solve your problem.
> In the script that produces the scrollable table, I have <table 
> class="scrollableTbl">
> I expect it to print all the rows from the scrollable table but it 
> just prints whatever displays on the screen (the first 20 lines). It 
> didn't print to the end of the table. The font size that I set for 
> printing works, though.
> Thanks for any help.
HTH,
Jean
--------------------
Jean,
I've added "visibility: visible;" in my print.css like you suggested 
but it still doesn't work. I even tried "display: table;" but nothng 
works.
I really appreciate your help.
Kady.
-----------------------
Can you explain what you mean when you said in the first answer 
that "One css-file will show all the tables etc, the other one will 
only show the content. Then use the first for media="screen" and the 
other for media="print".
In my program, I have 2 tables tags, one for the column headers, and 
the other for the rows (contents) and this second table has a srollable 
bar. Inside both of the table tags, I have <table class="scrollableTbl">
Do I miss anything here?
Thanks.