Capturing A Portion of Page Content

[ccemmett]

I'm working with a page filled with a listing of detailed field trip descriptions. I want to make it possible for people to only print out information for any single field trip without printing out the entire page.

I'm thinking that if I contain the content of each trip in a <div> with a singular id it may be possible to capture division contents to a variable which can then be passed to a script that would write it to a new printer friendly window.

The window writing script is no problem. What I can't figure out is how to capture selected content from the parent window.

Thanks in advance for your help,

Chad

[brothercake]

Just use print-media CSS to hide or show sections of content:

<style type="text/css" media="print">

div.there { display:block; }
div.notThere { display:none; }

</style>

[ccemmett]

Thanks Brother,

I used a different method beginning with script something like this in the head:

var title="Field Trip"
var text=""
function getTrip(trip) {
var obj=document.getElementById(trip)
text=obj.innerHTML
printWin("print.htm")
}

Followed by divisions like this in the body:

<div id="t1">
[i]HTML stuff[/i]
</div>
<p><a href="javascript:getTrip('t1')" class="js">Print This Field Trip</a></p>

What stumped me at first was learning the difference between obj.getInnerHTML which didn't work and obj.innerHTML which did!

The rest of the code is just a simple window writing function.

Finished page here:

http://goldengateaudubon.org/birding/fieldtrips.htm

Thanks again for your nudge!