3

My visualforce rendered as pdf is creating a blank page at the end because of a page-break-after: always setting. How do I stop this blank page being created? I have 4 repeating sections, and after each 4th section it has to have a page break, except for the last one.

My VF page:

<apex:page showHeader="false" sidebar="false" controller="CallCycleDocPrintController" renderAs="pdf" applyBodyTag="false" applyHtmlTag="false">

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>

        $j = jQuery.noConflict();

    $j(document).ready(function() {           
        window.print();
    });


    </script>

    <style>

        body { margin: 10px; font-family: Verdana, Tahoma, sans-serif }
        .title { padding: 5px 0; }
        .col10 {width:10%}
        .col15 {width:15%}
        .col30 {width:30%}
        .col40 {width:40%}
        .col50 {width:50%}

        .title h1 {font-size: 20px;text-align:center}
        h2 {font-size: 18px;text-decoration: underline; text-align:center}
        h3 {font-size: 14px; text-align:center; }
        h4 {font-size: 12px;}

        .account {
        padding: 5px;
        border-top: solid 1px #000;
        margin-top: 3px;
        }

        .c9 {background-color: #c9c9c9;}
        .f8 {background-color: #f8f8f8;}
        .d8 {background-color: #d8d8d8;}
        .clearBoth {clear: both;}

        table { width: 100%;}
        table, th, td{
        border: 1px solid #ccc;
        border-collapse: collapse;
        }
        .outer{border:none}

        th, td{
        padding: 5px;
        font-size: 9px;
        }
        th {text-align: center}

        .tright {text-align: right}
        .tcenter {text-align: center}

        .lineBreakTop {
        clear: both;
        border-top: solid 1px #000;
        }
        .lineBreak {
        clear: both;
        border-top: solid 1px #ccc;
        }

        .lineItem { page-break-inside: avoid; }

        @page {
            counter-increment: pages;
            @top-center {content: counter(page) " of " counter(pages);}
            @bottom-center {content: element(footer);}
        }
        div.footer {position: running(footer)}
        #pageNum: before {content: counter(pages);}

    </style>
</head>
<div class="footer" style="page-break-after:always;font-size:8pt;text-align:center">
    Call Cycle Documents for: {!CallCycleModel.CallCycle.SalesPerson__r.Name} [{!CallCycleDate}]<br />
</div>

<div class="title">
    <h1>Call Cycle Documents for: {!CallCycleModel.CallCycle.SalesPerson__r.Name} [{!CallCycleDate}]</h1>
</div>

<apex:repeat value="{!CallCycleModel.CallCycleActivities}" var="activity">               
    <div style="">
        <table class="outer">
            <tbody>
                <tr>
                    <td colspan="7" class="account outer center">
                        <h2>{!activity.CallCycleActivity.Account__r.AccountNumber} - {!activity.CallCycleActivity.Account__r.Name}</h2>
                    </td>
                </tr>
                <tr>
                    <td colspan="7" class="tcenter outer c9">
                        <h3>All Outstanding Appros</h3>
                    </td>
                </tr>
                <apex:repeat value="{!activity.ccaAppros}" var="appro">
                    <tr>
                        <td class="outer">
                            <div style="page-break-inside: avoid; outer">
                                <table>
                                    <tr>        
                                        <td colspan="5" class="f8">
                                            <h4>{!appro.approDate} : {!appro.oAppro.Name}</h4>
                                        </td>            
                                    </tr>              
                                    <tr>
                                        <th class="col10">Prod Code</th>                  
                                        <th>Prod Description</th>                  
                                        <th class="col10">Unit</th>                  
                                        <th class="col10">Quantity</th>                  
                                        <th class="col15">Price</th>                  
                                    </tr>
                                    <apex:repeat value="{!appro.oApproLs}" var="approl">
                                        <tr>        
                                            <td class="col10">
                                                {!approl.ProductCode}
                                            </td>
                                            <td class="">
                                                {!approl.Description}
                                            </td>            
                                            <td class="tcenter col10">
                                                {!approl.Unit__c}
                                            </td>            
                                            <td class="tright col10">
                                                {!approl.Quantity}
                                            </td>            
                                            <td class="tright col15">
                                                {!approl.UnitPrice}
                                            </td>            
                                        </tr>              
                                    </apex:repeat>
                                </table>
                            </div>
                        </td>
                    </tr>              
                </apex:repeat>
            </tbody>
        </table>
    </div>
    <div style="">
        <table>
            <tbody>
                <tr>
                    <td colspan="7" class="tcenter outer d8">
                        <h3>All Quotes</h3>
                    </td>
                </tr>
                <apex:repeat value="{!activity.ccaQuotes}" var="quote">
                    <tr>
                        <td class="outer">
                            <div style="page-break-inside: avoid; outer">
                                <table>
                                    <tr>        
                                        <td colspan="5" class="f8">
                                            <h4>{!quote.quoteDate} : {!quote.oQuote.Name}</h4>
                                        </td>            
                                    </tr>              
                                    <tr>
                                        <th class="col10">Prod Code</th>                  
                                        <th>Prod Description</th>                  
                                        <th class="col10">Unit</th>                  
                                        <th class="col10">Quantity</th>                  
                                        <th class="col15">Price</th>                  
                                    </tr>
                                    <apex:repeat value="{!quote.oQuoteLs}" var="quotel">
                                        <tr>
                                            <td class="col10">
                                                {!quotel.ProductCode}
                                            </td>
                                            <td class="">
                                                {!quotel.Description}
                                            </td>            
                                            <td class="tcenter col10">
                                                {!quotel.Unit__c}
                                            </td>            
                                            <td class="tright col10">
                                                {!quotel.Quantity}
                                            </td>            
                                            <td class="tright col15">
                                                {!quotel.UnitPrice}
                                            </td>                                               
                                        </tr>
                                    </apex:repeat>
                                </table>
                            </div>
                        </td>
                    </tr>              
                </apex:repeat>
            </tbody>
        </table>

    </div>
    <div>
        <table>
            <tbody>
                <tr>
                    <td colspan="7" class="tcenter outer c9">
                        <h3>All Invoices</h3>
                    </td>
                </tr>
                <apex:repeat value="{!activity.ccaInvoices}" var="invoice">
                    <tr>
                        <td class="outer">
                            <div style="page-break-inside: avoid;">
                                <table>
                                    <tr>        
                                        <td colspan="5" class="f8">
                                            <h4>{!invoice.InvoiceDate} : {!invoice.iInvoice.Name}</h4>
                                        </td>
                                    </tr>              
                                    <tr>
                                        <th class="col10">Prod Code</th>                  
                                        <th>Prod Description</th>                  
                                        <th class="col10">Unit</th>                  
                                        <th class="col10">Quantity</th>                  
                                        <th class="col15">Price</th>                  
                                    </tr>
                                    <apex:repeat value="{!invoice.iInvoiceLs}" var="invl">
                                        <tr>        
                                            <td class="col10">
                                                {!invl.AccredoProductID__c}
                                            </td>
                                            <td class="">
                                                {!invl.Description__c}
                                            </td>            
                                            <td class="tcenter col10">
                                                {!invl.Unit__c}
                                            </td>            
                                            <td class="tright col10">
                                                {!invl.Quantity__c}
                                            </td>            
                                            <td class="tright col15">
                                                {!invl.Price__c}
                                            </td>            
                                        </tr>              
                                    </apex:repeat>
                                </table>
                            </div>
                        </td>
                    </tr>              
                </apex:repeat>
            </tbody>
        </table>
    </div>    
    <div style="page-break-after:always">
        <table>
            <tbody>
                <tr>
                    <td colspan="7" class="tcenter outer d8">
                        <h3>All Memos</h3>
                    </td>
                </tr>
                <apex:repeat value="{!activity.ccaMemos}" var="memo">
                    <tr>
                        <td class="outer">
                            <div style="page-break-inside: avoid;">
                                <table>
                                    <tr>        
                                        <td colspan="5" class="f8">
                                            <h4>{!memo.mContact.Name} : {!memo.mContact.Phone} | {!memo.mContact.Title} | {!memo.mContact.Department}</h4>
                                        </td>
                                    </tr>              
                                    <tr>
                                        <th class="col10">Date</th>                  
                                        <th class="col10">Category</th>                  
                                        <th class="col15">Joint Visit</th>                  
                                        <th>Notes</th>                  
                                    </tr>
                                    <apex:repeat value="{!memo.mMemos}" var="mems">
                                        <tr>        
                                            <td class="col10">
                                                <apex:outputText value="{0, date, dd/MM/yyyy}">
                                                    <apex:param value="{!mems.Original_Memo_Date__c}" /> 
                                                </apex:outputText>       
                                               <!-- {!mems.Original_Memo_Date__c}-->
                                            </td>
                                            <td class="col10">
                                                {!mems.About_What__c}<br /><br />
                                                {!mems.Did_Not_Call_Reason__c}
                                            </td>
                                            <td class="col15">
                                                JV: {!if((mems.JointVisit__c==true),'Yes','No')}<br />
                                                Therapist Att: {!if((mems.Therapist_Attended_JV__c)==true, 'Yes','No')}<br />
                                                Client: {!mems.JointVisitPerson__c}<br />
                                                {!mems.Joint_Visit_Address__c}
                                            </td>            
                                            <td class="">
                                                {!mems.Memo_Notes__c}
                                            </td>            
                                        </tr>              
                                    </apex:repeat>
                                </table>
                            </div>
                        </td>
                    </tr>              
                </apex:repeat>
            </tbody>
        </table>
    </div> 
</apex:repeat>

3
  • 1
    I see you have page-break-after:always; on both the footer and "All Memos" divs. Do you need if on the latter? Commented Oct 12, 2015 at 7:51
  • No, I don't need it on the footer actually. I removed it, but it doesn't stop the last page being blank (unfortunately) :(
    – Irene
    Commented Oct 12, 2015 at 22:13
  • Try overflow:hidden in your CSS along with page-break-after:always Commented Aug 9, 2017 at 12:22

3 Answers 3

3

The suggestion from How to deal with page breaks when printing a large HTML table seems applicable:

Note: when using the page-break-after:always for the tag it will create a page break after the last bit of the table, creating an entirely blank page at the end every time! To fix this just change it to page-break-after:auto. It will break correctly and not create an extra blank page.

So, try changing your footer style from page-break-after:always; to page-break-after:auto;

3
  • That stops the last page from being blank, but it also stops the page break after the Memo block, which isn't right for my case. It needs to do a page break for each Account (under which are the 4 repeating blocks). Maybe I need to do another <div> around the outside and do the 'auto' for that...
    – Irene
    Commented Oct 13, 2015 at 1:53
  • No, that didn't work either. I put the outer div in but the page-break-auto doesn't actually do a page break, so I don't know what it does, or what I'm doing wrong!
    – Irene
    Commented Oct 13, 2015 at 2:07
  • Perhaps using a well placed page-break-before: always; would be a better alternative. I haven't been able to try it out in practice. Maybe consider working from a simplified Visualforce page and adding distinctive colors to show which div is appearing where. Commented Oct 13, 2015 at 7:01
1

I know this is old, but not sure if it's been fully solved. I ended up using page-break-after: auto; twice to get the desired effect...successfully breaking where it needed to and not adding the blank page at the end. I'm calling a component, but that could be where you put all of your markup. Also notice the second page-break-after inside the div inside the repeat. This combination is what made it work for me:

<apex:page standardController="MyObject__c" renderAs="PDF">
    <apex:repeat var="record" value="{!MyObject__c.RelatedRecords__r}">
        <div style="page-break-after: auto;">
            <c:MyCustomComponent theRecord="{!record}" />
            <p style="page-break-after: auto;" /> <!-- // need this one and the one in the div to make sure appropriate page breaking. -->
        </div>
    </apex:repeat>
</apex:page>

I hope this helps someone looking in the future!

0

I would like to contribute the following response because the original problem was not what I thought it was. I assumed a completely blank extra page was being created after each page break, but that was not the case.

Just to give you a quick background: I am creating a PDF showing company employees. Each page has 3 fixed-sized rows on each page, and 3 fixed-sized columns per row. I included a 2px solid black border around each column, so the whole page had a grid-like appearance. The size of the border was causing a sliver of each bottom border to bleed onto its own page, followed by nothing but white space to the end of the new page.

So it looked like a fresh clean page break but it wasn't. As soon as I changed the border to 1px, it no longer bled onto its own page, and the table successfully generated 3 rows per page, no extra pages in between.

I hope this helps somebody in the future.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .