Creating the first page is straightforward and explained elsewhere. The trickier part is how to add a new page whenever the previous one is overflowed. The function onPageComplete() is called whenever the last page is overflowed by a longer source. This function is similar to the addFirstPage() function we showed in a previous tip. We assemble a variable, newHTML, with one LayoutRect element within a DeviceRect element:

function onPageComplete() {
  if (event.contentOverflow) {
    document.all("layoutrect" + lastPage).onlayoutcomplete = null;
    newHTML  = "<IE:DEVICERECT ID='devicerect" + (lastPage + 1) +  
               "' MEDIA='print' CLASS='masterstyle'>";
    newHTML += "<IE:LAYOUTRECT ID='layoutrect" + (lastPage + 1) + 
               "' ONLAYOUTCOMPLETE='onPageComplete()' NEXTRECT='layoutrect" + 
               (lastPage + 2) + "'  CLASS='contentstyle'/>";
    newHTML += "</IE:DEVICERECT>";

    devicecontainer.insertAdjacentHTML("beforeEnd", newHTML);
    lastPage++;
  }
}

The variable lastPage is initialized to 1 before calling the first page, and is incremented after creating a new page.

For more information on print templates, go to Column 89, Print Templates, Part I.

People who read this tip also read these tips:

• Detecting Object-Property Relationship
• The Virtual Root Node Type
• Detecting the CTRL Key
• Setting an Attribute Node
• The Comment Node