PDA

Click to See Complete Forum and Search --> : print buttons

CanadianGirl
07-23-2003, 08:29 PM
hey,

I've got a page with several lines of information about employees.. and I have 2 buttons for printing.. a "print all" button that prints the entire contents of the screen.. or a "print details" button that will print each employee's info on a seperate page..

I'm not sure how to do this.. this is the code I've got so far as an example:

I think it's changing the print style when I press the button, but now not sure how to get it to actually print..

Thanx..


<!-- the br tag will hold the printing style -->
<style type="text/css">
br {}
</style>


<script>
// This function fetches the style by its selector text
// (aka. class name). Using this function you can find
// the style to modify and then use pageBreakAfter property
// to break up the report.
function getStyleBySelectorText(selectorText)
{
var i_ss;
var i_rl;
selectorText = selectorText.toLowerCase();
for (i_ss = 0; i_ss < document.styleSheets.length; i_ss++)
{
var rules = document.styleSheets[i_ss].rules;
for (i_rl = 0; i_rl < rules.length; i_rl++)
if (selectorText == rules[i_rl].selectorText.toLowerCase())
{
return rules[i_rl].style;
window.print();
}
else
{
window.print();
return null;
}
}
}

function doPrint(param)
{
if(param == true)
{
window.print();
}
return null;
}
</script>

</head>

<body>
<center>
<h2>Payroll</h2>

<table>
<tr>
<td>
John Smith: $1,200
<br>
</td>
</tr><tr>
<td>
Bob McDonald: $1,099
<br>
</td>
</tr><tr>
<td>
Adam Appleyard: $1,700
<br>
</td>
</tr><tr>
<td>
&nbsp;
</td>
</tr><tr>
<td>
<input type="button" value="Print all" onClick="getStyleBySelectorText('BR').pageBreakAfter = 'auto';" >
<input type="button" value="Print details" onClick="getStyleBySelectorText('BR').pageBreakAfter = 'always';" >
</td>
</tr>
</table>

</center>
CanadianGirl
07-23-2003, 09:23 PM
here's the code:

<style type="text/css">
br {}
</style>
<!--------------------------------------------->

<script>
// This function fetches the style by its selector text
// (aka. class name). Using this function you can find
// the style to modify and then use pageBreakAfter property
// to break up the report.
function getStyleBySelectorText(selectorText)
{
var i_ss;
var i_rl;
selectorText = selectorText.toLowerCase();
for (i_ss = 0; i_ss < document.styleSheets.length; i_ss++)
{
var rules = document.styleSheets[i_ss].rules;
for (i_rl = 0; i_rl < rules.length; i_rl++)
if (selectorText == rules[i_rl].selectorText.toLowerCase())
{
return rules[i_rl].style
window.print();

}
else
{
window.print();
return null;
}
}
}

function doPrint()
{
window.print();
return null;
}
</script>

</head>

<body>
<center>
<h2>Payroll</h2>

<table>
<tr>
<td>
John Smith: $1,200
<br>
</td>
</tr><tr>
<td>
Bob McDonald: $1,099
<br>
</td>
</tr><tr>
<td>
Adam Appleyard: $1,700
</td>
</tr><tr>
<td>
<center>
<input type="button" value="print All" onClick="getStyleBySelectorText('BR').pageBreakAfter = 'auto'; doPrint();">
<input type="button" value="print Details" onClick="getStyleBySelectorText('BR').pageBreakAfter = 'always'; doPrint();">
</center>
</td>
</tr>
</table>