Create a Web print button that omits certain items on the page

Create a Web print button that omits certain items on the page

Ever want to have a print button on your Web page that only prints certain parts of the page and omits other parts? This can easily be done in Notes with a Hide/When for printing. Here's a way to do it with javascript on the Web.


Simply enclose the parts of the page you wish not to print with the following:

<div id="divNoPrint1">
Dont print this line
</div>

Of course the "Dont print this line" is my sample text, and the <div> elements need to be pass-thru HTML.

As you add multiple DIV statements to omit other parts of your page increment the div number (ie "divNoPrint2" and "divNoPrint3" etc.. in place of the divNoPrint1 example above)

Then add the following function to JS Header of the form.

function printPage() {
var numDivs = 20;
for(i=1;i<numDivs;i++) {
  if(document.all['divNoPrint'+i]){
    document.all['divNoPrint'+i].style.display = 'none'; }
 }
 window.print();
for(i=1;i<numDivs;i++) {
  if(document.all['divNoPrint'+i]){
    document.all['divNoPrint'+i].style.display = ''; }
 } 
}

This function above only supports 20 items, but of course you can change the divNums variable to be a higher number if necessary.

Then add a print button to your page, form, or view template as such:

<div id="divNoPrint3" align=right><a href="#" 
onClick="printPage();"><img src="/icons/actn147.gif"

    Requires Free Membership to View

    Login

    Register today to access targeted resources from our editorial writers and independent industry experts focused on Lotus Domino, Notes, Workplace and other related technologies.

    By submitting your registration information to SearchDomino.com you agree to receive email communications from TechTarget and TechTarget partners. We encourage you to read our Privacy Policy which contains important disclosures about how we collect and use your registration and other information. If you reside outside of the United States, by submitting this registration information you consent to having your personal data transferred to and processed in the United States. Your use of SearchDomino.com is governed by our Terms of Use. You may contact us at webmaster@TechTarget.com.

 border=0 
alt="Print page"></a></div>

Of course make sure the above code for the print button is pass-thru HTML. (And note how it is using the name "divNoPrint3" so that it wont be printed.)

And thats it. When the print button is clicked the page will appear to jump for a second (hiding the sections that are not to be printed) and then the print dialog box will come up and the page will return to normal.

This was first published in December 2001

Disclaimer: Our Tips Exchange is a forum for you to share technical advice and expertise with your peers and to learn from other enterprise IT professionals. TechTarget provides the infrastructure to facilitate this sharing of information. However, we cannot guarantee the accuracy or validity of the material submitted. You agree that your use of the Ask The Expert services and your reliance on any questions, answers, information or other materials received through this Web site is at your own risk.

Back to top