Skip to main content
Topics#VisualforceJason Newbury's Question
Jason Newbury asked in #Visualforce
Oct 11, 2022, 1:28 AM

How to supress the footer facet on all but the last page of paginated pageBlockTable rendered as PDF

Hey folks,

I'm using  style="-fs-table-paginate: paginate;" on my apex:pageBlockTable and it is successfully adding my header row to each page of my PDF, BUT, it is also showing the footer facet on every page, which I do not want. I want the total row to appear only on the final page. Any tips on how to achieve this would be most appreciated. Here is a cut-down version of my page.

<apex:page renderAs="PDF" controller="PaymentAdviceController" applyBodyTag="false" applyHtmlTag="false" showHeader="false">

    <head>

       <style>

        @page {

             margin: 1in;

             size: 25in 15in;

             @bottom-center {

                font-family: Dialog;

                content: "Page " counter(page) " of " counter(pages);

            }

           }

        .col1 {width:160px; text-align:left;}

        .col2 {width:1800px; text-align:center;}

        .col3 {width:220px; text-align:right;}

        .headerRow .TableTitleCenter {

            background-color: ⌗ff5b5b;

            font-family: Dialog;

            text-align:center;

            padding:4px;

        }

        .headerRow .TableTitle {

            background-color: ⌗ff5b5b;

            font-family: Dialog;

            padding:4px;

        }

        .tableCell{

            page-break-inside: avoid;

        }

       </style>

    </head>

    <apex:panelGrid columns="3" columnClasses="col1,col2,col3">

        <img src="{!$Resource.DDLogo}" height="143px" width="223px" align="left" />

        <apex:panelGrid columns="2" width="100%" style="font-weight:bold;font-family: Dialog;font-size:25px">Telstra Commissions Payment Advice</apex:panelGrid>

        <apex:panelGrid columns="1" width="100%" style="font-style:bold;font-family: Dialog;">

            <apex:outputText value="{0, date,  dd/MM/yyyy}" >Date Processed: <apex:param value="{!dateFriday}" /></apex:outputText>

        </apex:panelGrid>

    </apex:panelGrid>

    <apex:pageBlock>

        <apex:pageBlockTable value="{!Payments}" var="payment" border="1px" width="100%" cellpadding="0px" style="-fs-table-paginate: paginate;">

            <apex:column headerValue="Account Number" headerClass="TableTitleCenter" style="font-family: Dialog;text-align:center;font-size:13px;padding:4px;">

                <apex:outputText value="{!payment.Expected_Commission__r.Project__r.Account__r.AccountNumber}" style="tableCell" />

                <apex:facet name="footer">

                    <div style="font-family: Dialog;font-size:13px;text-align:right;font-weight:bolder;background-color: ⌗ebebeb;padding:4px;">&nbsp;</div>

                </apex:facet>

            </apex:column>

            <apex:column headerValue="Total Ex GST" headerClass="TableTitleCenter" style="font-family: Dialog;font-size:13px;text-align:right;padding:4px;">

            <apex:outputText value="{0, number, Currency}" style="tableCell"><apex:param value="{!payment.Dealer_CN_to_be_raised_Ex__c}" /></apex:outputText>

                <apex:facet name="footer">

                    <div style="font-family: Dialog;font-size:13px;text-align:right;font-weight:bolder;background-color: ⌗ebebeb;padding:4px;">${!exclGST}</div>

                </apex:facet>

            </apex:column>

            <apex:column headerValue="Total Inc GST" headerClass="TableTitleCenter" style="font-family: Dialog;font-size:13px;text-align:right;padding:4px;" >

                <apex:outputText value="{0, number, Currency}" style="tableCell"><apex:param value="{!payment.Dealer_Total_Inc_GST__c}" /></apex:outputText>

                <apex:facet name="footer">

                    <div style="font-family: Dialog;font-size:13px;text-align:right;font-weight:bolder;background-color: ⌗ebebeb;padding:4px;">${!inclGST}</div>

                </apex:facet>

            </apex:column>

            <apex:column headerValue="Credit Note Number" headerClass="TableTitleCenter" style="font-family: Dialog;text-align:center;font-size:13px;padding:4px;">

                <apex:outputText value="{!payment.Credit_Note__c}" style="tableCell" />

                <apex:facet name="footer">

                    <div style="font-family: Dialog;font-size:13px;text-align:right;background-color: ⌗ebebeb;padding:4px;">&nbsp;</div>

                </apex:facet>

            </apex:column>

        </apex:pageBlockTable>

    </apex:pageBlock>

    <br/>

    <apex:outputText style="font-family: Dialog;font-size:12px" value="Some trailing text here:"/>

    <br/>

</apex:page>
3 answers
  1. Dora Nevels
    Feb 2, 7:26 AM

    Hello, 

    To stop the footer from repeating, you should

    remove the <apex:facet name="footer"> tags from inside the table and place your totals in a separate <div> or <table> immediately following the </apex:pageBlockTable>.

    This works because the -fs-table-paginate property specifically forces <thead> and <tfoot> elements (which facets generate) to repeat on every page break; moving the data outside the table context ensures it only renders once at the very end of your data list.

Write an answer...
0/9000