printing out a data table as it currently appears

laredotornado · Feb 9, 2007

Hi,

I have a data table on my page (buried amidst other images and
extraneous text). I would like to spawn a new window that
automatically prints the content of my data table, and only that
content. The tricky part is the ordering of the table may not be the
same as when the page was loaded. I recently discovered the virtues
of JQuery and its tablesorter plugin (http://motherrussia.polyester.se/
jquery-plugins/tablesorter/), so it is possible my user will sort the
table rows to his satisfaction before printing.

Your help is greatly appreciated, - Dave

RobG · Feb 9, 2007

Hi,

I have a data table on my page (buried amidst other images and
extraneous text). I would like to spawn a new window that
automatically prints the content of my data table, and only that
content. The tricky part is the ordering of the table may not be the
same as when the page was loaded. I recently discovered the virtues
of JQuery and its tablesorter plugin (http://motherrussia.polyester.se/
jquery-plugins/tablesorter/), so it is possible my user will sort the
table rows to his satisfaction before printing.

Your help is greatly appreciated, - Dave

Have you tried making a clone of the table and putting it into the new
window?

A quick example is below, feature detection etc. has been omitted for
brevity. I'm not sure all browsers will let you move DOM elements
across windows, though I think any that support jQuery will.

If not, wrap the table in a DIV, grab its innerHTML and write that to
the popup (make sure you write the *entire* table if using this method).
You will probably need to add elements for style and script support if
you want the popup to behave like the parent.

<script type="text/javascript">

function popWin () {
var w = window.open('','tableWindow','');
w.document.write('<title>Data table</title><body></body>');
w.document.close();
return w;
}

function popTable(id){
var tableWin = popWin();

// Clone the table and add it to the popup
var table = document.getElementById(id).cloneNode(true);
tableWin.document.body.appendChild(table);
}

</script>
<table id="x"><tr><td>foo<td>bar</table>
<button onclick="popTable('x');">Show table in new window</button>

Draw a real-time flot chart by fetching data from database and store it into an array using JavaScri	0	Sep 3, 2015
IE will always render a table as a table... or will it?	5	Dec 6, 2004
Problem printing large image in an HTML table	0	May 14, 2008
Is it possible for 2 Object Data Sources to share a table adapter?	0	Dec 17, 2007
Inserting data from an array into an ms access 2000 table	2	Jul 20, 2008
Extracting a table from a webpage	2	Apr 28, 2008
Script for adding and deleting rows to a table	1	Jun 22, 2006
Retrieve table cell data in a Repeater - How?? Need help!	0	May 4, 2006

printing out a data table as it currently appears

laredotornado

RobG

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads