0

I am trying to make a visualforce page that omits the footer if certain conditions are true. I made a test page that uses apex:repeat to only show the footer on even-numbered pages, but it's not working. Not only is the footer displaying on odd-numbered pages, but it's displaying content from a previous iteration of the apex:repeat (screenshots attached).

I tried using solutions from the below similar questions, but they're not working:

Code:

<apex:page id="FS_Test"
           readOnly="true"
           applyBodyTag="false"
           renderAs="advanced_pdf"
           sidebar="false"
           showHeader="false"
           standardStylesheets="false"
           cache="true"
           controller="FS_TestController"
>


    <head>
        <style type="text/css" media="print">
            @page {
                margin : 50px .5in 365px .5in;

                @top-center {
                    content: element(header);
                }

                @bottom-center {
                    content: element(footer);
                }

                padding-top: 60px;
            }

            @page pageWithoutFooter {
                @bottom-center {
                    content: none;
                }
            }

            div.header {
                display: block;
                position: running(header);
                font-family: Arial Unicode MS, sans-serif;
                text-align: center;
            }

            div.content.header {
                display: block;
                position: running(header);
                font-family: Arial Unicode MS, sans-serif;
                text-align: center;
            }

            .footer {
                display: block;
                position: running(footer);
                color: blue;
                font-family: Arial Unicode MS, sans-serif;
            }

            .pageWithoutFooter {
                page: pageWithoutFooter;
            }

            div.content {
                font-family: Arial Unicode MS, sans-serif;
                font-size: 14px;
            }

            div.content {
                font-family: Arial Unicode MS;
            }

        </style>
    </head>


    <div class="content">
        <apex:repeat value="{!testList}" var="pageNum">
            <div style="page-break-after:always;">

                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>


                <apex:outputPanel rendered="{!pageNum==1 || pageNum==3}">
                    <div class="footer">
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                    </div>
                </apex:outputPanel>

                <apex:outputPanel rendered="{!pageNum==2 || pageNum==4}">
                    <div class="pageWithoutFooter">

                    </div>
                </apex:outputPanel>

            </div>
        </apex:repeat>
    </div>


</apex:page>

Page 1 screenshot (displaying correctly)

enter image description here

Page 2 screenshot (displaying INCORRECTLY) enter image description here

Improve this question
0

1 Answer 1

Reset to default
1

**The reason the footer was displaying with incorrect content is because we have to specify a footer (even if it's a blank one). I guess when you use running:footer, it will take the default footer if one is not rendered. Working code below: **

<apex:page id="FS_Test"
           readOnly="true"
           applyBodyTag="false"
           renderAs="advanced_pdf"
           sidebar="false"
           showHeader="false"
           standardStylesheets="false"
           cache="true"
           controller="FS_TestController"
>


    <head>
        <style type="text/css" media="print">
            @page {
                margin : 50px .5in 365px .5in;

                @top-center {
                    content: element(header);
                }

                @bottom-center {
                    content: element(footer);
                }

                padding-top: 60px;
            }

            @page pageWithoutFooter {
                @bottom-center {
                    content: none;
                }
            }

            div.header {
                display: block;
                position: running(header);
                font-family: Arial Unicode MS, sans-serif;
                text-align: center;
            }

            div.content.header {
                display: block;
                position: running(header);
                font-family: Arial Unicode MS, sans-serif;
                text-align: center;
            }

            .footer {
                display: block;
                position: running(footer);
                color: blue;
                font-family: Arial Unicode MS, sans-serif;
            }

*/            /*.pageWithoutFooter {*/
            /*    page: pageWithoutFooter;*/
            /*}

            div.content {
                font-family: Arial Unicode MS, sans-serif;
                font-size: 14px;
            }

            div.content {
                font-family: Arial Unicode MS;
            }

        </style>
    </head>


    <div class="content">
        <apex:repeat value="{!testList}" var="pageNum">

                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>
                <p>THIS IS CONTENT CONTENT page {!pageNum}</p>


                <apex:outputPanel rendered="{!pageNum==1 || pageNum==3}">
                    <div class="footer">
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                        <p>THIS IS FOOTER CONTENT page {!pageNum}</p>
                    </div>
                </apex:outputPanel>

                <apex:outputPanel rendered="{!pageNum==2 || pageNum==4}">
                    <div class="footer">

                    </div>
                </apex:outputPanel>

            </div>
        </apex:repeat>
    </div>


</apex:page>
Improve this answer

You must log in to answer this question.

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