0

I have a visualforce page with a component to create a tabular of timecard data. I would like to have the header rows repeated on each physical page and possibly even include a page number. Does anyone have an example of how to do this in visualforce?

<apex:page sidebar="false" showHeader="false" tabStyle="Account" 
       standardController="c2g__codaInvoice__c"
       extensions="pdfExtension"
       contentType="application/pdf" renderAs="PDF"
       applyHtmlTag="false" applyBodyTag="false" >
<head>
    <style type="text/css">
        body { font-family: 'Arial Unicode MS'}
        label { font-weight: normal; font-size: 14px; padding-left:4px; padding-top:2px}
        .newpage { page-break-after:always}
        .header { font-weight: normal; font-size: 14px; padding-left:6px; padding-top:2px}
        .headerc { font-weight: normal; font-size: 14px; padding-left:6px; padding-top:2px; text-align:center;}
        .header2 { font-weight: normal; font-size: 14px; padding-left:6px; padding-bottom:4px; padding-top:16px}
        .header2a { font-family: Helvetica; font-weight: bolder; font-size: 14px; padding-left:6px; padding-bottom:0px; padding-top:16px}
        .header2b { font-family: Helvetica; font-weight: bolder; font-size: 14px; padding-left:6px; padding-bottom:0px; padding-top:0px}
        .header2c { font-family: Helvetica; font-weight: bolder; font-size: 14px; padding-left:6px; padding-bottom:25px; padding-top:0px}
        .tchheader { font-weight: bold; font-size: 14px; padding-left:6px; padding-top:8px}
        .field { font-weight: bold; font-size: 11px; padding-left:6px; padding-top:6px}
        .fieldc { font-weight: bold; font-size: 11px; padding-left:6px; padding-top:6px; text-align:center;}
        .hiddenfield { visibility: hidden}
        .blankline { visibility: hidden; font-weight: bold; font-size: 11px; padding-top:0px}
    </style>
    <style type="text/css" media="print">
        @page { 
            @top-center {
                content: element(header);
            }
        }
        div.header {
            position: running(header);
        }

        .sectionTitle {
            font-weight: bold;
        }
    </style>
</head>

<c:TCHDetailComponent sin="{!c2g__codaInvoice__c }" RenderPDF="true" /> 

</apex:page>


<apex:component controller="TCHDetailController">
<apex:attribute name="sin"       description="SIN Object"    type="c2g__codaInvoice__c" required="true" assignTo="{!ControlSIN}"/>
<apex:attribute name="RenderPDF" description="Render As PDF" type="Boolean"             required="true" assignTo="{!onlyIfPDF}"/>
<apex:form >
    <apex:outputText styleClass="hiddenfield" label="" value="{!sin.ffpsai__BillingEvent__r}" />
    <apex:outputText styleClass="hiddenfield" label="" value="{!sin.c2g__Account__r.Name}" />
    <apex:outputText styleClass="hiddenfield" label="" value="{!sin.c2g__InvoiceDescription__c}" />

    <apex:pageBlock mode="maindetail" >
        <apex:pageBlockSection title="" columns="1" >
            <apex:outputText styleClass="header2" value="Billing Detail for {!sin.Name}" />
            <apex:outputText styleClass="header2" value="{!CustomerPlusDesc}" />
            <apex:pageBlockTable width="100%" value="{!TCHDetail}" var="item" headerClass="tchheader">
                <apex:column headerClass="header" styleClass="field" width="15%" headerValue="Resource" value="{!item.Name }" />
                <apex:column headerClass="headerc" styleClass="fieldc" width="15%" headerValue="Date"> 
                    <apex:outputText value="{0,date,EEE MM-dd-yyyy}">
                        <apex:param value="{!item.Day }" />
                    </apex:outputText>
                </apex:column>
                <apex:column headerClass="headerc" styleClass="fieldc" width="5%" headerValue="Hours" value="{!item.Hours }" />
                <apex:column headerClass="header" styleClass="field" width="65%" headerValue="Notes" value="{!item.Notes }" />
            </apex:pageBlockTable>
        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:form>
</apex:component>
4
  • 1
    Hi there! I linked several relevant duplicates that may help you. If not, please let us know how we can further assist you, and we'll be glad to reopen your question. Thanks! – sfdcfox Sep 27 '20 at 0:50
  • I have seen these articles but I am not sure how it relates to the pageblocktable since I am not using html tables with th tags. If I include the @page style entries, will it automatically repeat the header values? – Jerry Welliver Sep 27 '20 at 3:55
  • It should. PageBlockTable still renders a normal table, just with extra styling. – sfdcfox Sep 27 '20 at 12:51
  • I added the style but it still does not repeat the headings for each page. What am I missing? I updated the original post with the latest page and component. – Jerry Welliver Sep 27 '20 at 21:45