function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
raji devi 1raji devi 1 

Page Break when visual force PDF is rendered dynamically content

Hi All, 
I am generating a pdf .
the content on  the pdf is dynamic images of different products.In my code i have two tables.
i want to fit the content of one page , but in my pdf content is going to other page .My all product images are >=150px
if the product information is not fit into one page i want to move to other page , which should happen when page rendered .
I used "page-break-after:always;" but it is not working & added "fs-table-paginate: paginate;" if i used this i am getting blackblocks end of the pages so i removed. pls find attached my code & help me to over come this.

<apex:page standardcontroller="Quote" sidebar="false" showHeader="false" renderAs="pdf" applyBodyTag="false" standardStylesheets="true">
<apex:form >
<head>
<style type="text/css" >
@page {
/* Landscape orientation */
/* size:landscape; */
/* Portrait orientation */
size:portrait;
margin:190px 50px 60px 50px;
background:#fff;
 @top-center {
 content: element(header);
}
@bottom-left {
 content: element(footer);
}
}
div.footer {
    display: block;
    padding: 0px;
    position: running(footer);
    background: #fff;
    height: 75px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding: 10px 0 0 0;
}
div.header {
    display: block;
    position: running(header);
    background: #fff;
    height: 190px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}
div.content {
    background: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 50%;
}
.pagenumber:before {
    content: counter(page);
}
.pagecount:before {
    content: counter(pages);
}
.allFontsize {
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
"
}


  

</style>

<!------------added by raji--------------------
<style type="text/css">


 table { page-break-inside:auto }
   tr    { page-break-inside:avoid; page-break-after:auto }
.p {
        page-break-inside: avoid;
    }
   table { page-break-inside:auto }
   tr    { page-break-inside:avoid; page-break-after:auto }

</style>
<style type="text/css">


@media print {
    p {
        page-break-inside: avoid;
    }
}
</style>------------------------------------->


</head>


<div class="header">
    <apex:image value="{!$Resource.askagroupHeader}" height="186" width="700"/>
  </div>
  <div class="footer">
    <apex:image value="{!$Resource.askagroupFooter}" height="46" width="700"/>
  </div>
  <div class="content" > 
    <!-- Quote Format Start --> 
 
    <!-- Quote Format End --> 
    
    <!-- Industrial Quote Format Start-->
    <table width="700" border="0" align="center" cellpadding="0" cellspacing="0" style="font-family:Arial, Helvetica, sans-serif;font-size:12px;">
      <tr>
        <td align="center" valign="middle"><h2><u>QUOTATION</u></h2></td>
      </tr>
      <tr>
        <td height="25" align="left" valign="middle">Ref: {!Quote.QuoteNumber} </td>
      </tr>
      <tr>
        <td height="25" align="left" valign="middle">Dt.:
          <apex:outputText value="{0,date,dd'/'MM'/'yyyy}">
            <apex:param value="{!Quote.CreatedDate}"/>
          </apex:outputText></td>
      </tr>
      <tr>
        <td height="30" align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle"><u>Company Name &amp; Address</u></td>
      </tr>
      <tr>
        <td align="left" valign="middle">Address Line1: {!Quote.BillingName} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Address Line2: {!Quote.BillingStreet} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Address Line3: {!Quote.BillingCity} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Contact Ph.: {!Quote.Phone} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Contact Mob.: {!Quote.Mobile__c} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Email: {!Quote.Email} </td>
      </tr>
      <tr>
        <td height="30" align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle">Kind Attn.: {!Quote.Contact.Name} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Ref. No.: {!Quote.Ref_No__c} </td>
      </tr>
      <tr>
        <td align="left" valign="middle">Sub.: <strong>{!Quote.Name}</strong></td>
      </tr>
      <tr>
        <td height="25" align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle">Dear Sir/Madam,</td>
      </tr>
      <tr>
        <td align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle">We thankfully acknowledge receipt of your valued enquiry and as accordingly we are pleased to submit our formal Quotation with reference to your RFQ as under:-</td>
      </tr>
      <tr>
        <td align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle"><table width="700" border="1" cellspacing="0" cellpadding="0" bgcolor="#000" style="min-width:700px;max-width:700px; ">
            <tr>
              <th align="center" valign="middle" bgcolor="#FFFFFF" height="30">Line Item</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Product Description</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Part Code</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">UOM</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Qty</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">MOQ</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Price</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Value</th>
              <th align="center" valign="middle" bgcolor="#FFFFFF">Image</th>
            </tr>
            <apex:repeat var="lineItemObj" value="{!Quote.QuoteLineItems}">
              <tr >
                <td align="left" valign="middle" bgcolor="#FFFFFF" >{!lineItemObj.Product2.Name}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" ><apex:outputField value="{!lineItemObj.Product2.Description}" styleClass="p"/></td>
                <td align="left" valign="middle" bgcolor="#FFFFFF">{!lineItemObj.Product2.ProductCode}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" >{!lineItemObj.UOM__c}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" >{!lineItemObj.Quantity}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" >{!lineItemObj.MOQ__c}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF">{!lineItemObj.ListPrice}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" >{!lineItemObj.Quote.Grand_Total__c}</td>
                <td align="left" valign="middle" bgcolor="#FFFFFF" width="180"><apex:outputField value="{!lineItemObj.Product2.Image__c}" style="width:200px;pagreak-after:always;"   /></td>
              </tr>
            </apex:repeat>
          </table>
          <br clear="right" />
          </td>
      </tr>
      <tr>
        <td align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <th align="left" valign="middle"><em>Product Datasheet attached.</em></th>
      </tr>
      <tr>
        <td align="left" valign="middle">&nbsp;</td>
      </tr>
      <tr>
        <td align="left" valign="middle"><apex:outputPanel id="termsConds" rendered="{!Quote.Terms_Conditions__c}" >
            <table width="100%" border="0" cellspacing="0" cellpadding="0" >
              <tr>
                <th align="left" valign="middle" styleClass="allFontsize"><u><em>Please refer to our terms and conditions next page…</em></u></th>
              </tr>
              <tr>
                <td align="left" valign="middle">&nbsp;</td>
              </tr>
              <tr>
                <th align="left" valign="middle" styleClass="allFontsize"><u>Terms &amp; conditions</u></th>
              </tr>
              <tr>
                <td align="left" valign="middle">&nbsp;</td>
              </tr>
              <tr>
                <td align="left" valign="middle" styleClass="allFontsize"><table width="100%" border="1" cellspacing="1" cellpadding="5" bgcolor="#000000" >
                    <tr>
                      <td width="6%" align="center" valign="middle" bgcolor="#FFFFFF">1.</td>
                      <td width="18%" align="left" valign="top" bgcolor="#FFFFFF">Prices</td>
                      <td width="76%" align="left" valign="top" bgcolor="#FFFFFF"> {!Quote.Price_Term__c} <br/></td>
                    </tr>
                    <tr>
                      <td align="center" valign="middle" bgcolor="#FFFFFF">2.</td>
                      <td align="left" valign="top" bgcolor="#FFFFFF">P&amp;F Charges</td>
                      <td align="left" valign="top" bgcolor="#FFFFFF">Extra @ 2%</td>
                    </tr>
                    <tr>
                      <td align="center" valign="middle" bgcolor="#FFFFFF">3.</td>
                      <td align="left" valign="top" bgcolor="#FFFFFF">Excise Duty</td>
                      <td align="left" valign="top" bgcolor="#FFFFFF">Not Applicable</td>
                    </tr>
                    <tr>

User-added image

 Thanks,
Raji
VineetKumarVineetKumar
Usually page rendered as PDF is not actually what it looks as a normal VF page, you will have to put PDF specific styling and CSS, to order and fix the table and it's content.