You need to sign in to do that
Don't have an account?
Mark Potten
adding page breaks in visualforce
HI All
I am trying to add a page break to stop my parts and labour charge tables from spreeding across the page 1 and page 2 boundry . I am very new to coding so not overly familiar with things as I am self taught.
What happens is that sometimes the actions taken section (the work that was carried out on a repair) is long and the parts and labour tables run over the pages with the header on page 1 and the items uses on page 2. I would like to have a page break so that the tabel stays together and not runs over the page but this only has to happen if the report goes across multpile pages.
here is the code section that relates to the area on the PDF i am refering too
example of the issue above
many thansk
mark
I am trying to add a page break to stop my parts and labour charge tables from spreeding across the page 1 and page 2 boundry . I am very new to coding so not overly familiar with things as I am self taught.
What happens is that sometimes the actions taken section (the work that was carried out on a repair) is long and the parts and labour tables run over the pages with the header on page 1 and the items uses on page 2. I would like to have a page break so that the tabel stays together and not runs over the page but this only has to happen if the report goes across multpile pages.
here is the code section that relates to the area on the PDF i am refering too
</tr> <tr style="{!IF(TRIM(Case.Description) = '', 'display:none', '')}"> <td colspan="2"><br /><b>Description:</b><br />{!Case.Description}</td> </tr> <tr> <td colspan="2"><br /><b>Actions Taken:</b><apex:outputText escape="false" value="{!Case.Actions_Taken__c}" /></td> </tr> <tr> <th style="{!IF(Case.Hardware_Modification_Upgrade__c, '', 'display:none')}"> Hardware Upgrade Details: </th> <th style="{!IF(Case.Software_Update__c, '', 'display:none')}"> Software Upgrade Details: </th> </tr> <tr> <td style="{!IF(Case.Hardware_Modification_Upgrade__c, '', 'display:none')}"> {!case.Hardware_Modification_Upgrade_Details__c} </td> <td style="{!IF(Case.Software_Update__c, '', 'display:none')}"> {!case.Software_Update_Details__c}! </td> </tr> <tr style="{!IF(Case.Parts_Used__r.size > 0, '', 'display:none')}"> <td colspan="2"> <br /> <b>Parts Used:</b> <table class="itemTable"> <tr> <th>Part Code</th> <th>Description</th> <th class="text-right">QTY</th> <th class="text-right">Total Price</th> </tr> <apex:repeat value="{!Case.Parts_Used__r}" var="part"> <tr> <td>{!part.Product__r.Code__c}</td> <td>{!part.Product__r.Name}</td> <td class="text-right">{!part.Quantity__c}</td> <td class="text-right"><span style="{!IF(part.Total_Price__c = 0, 'display:none', '')}">${!part.Total_Price__c}</span></td> </tr> </apex:repeat> </table> </td> </tr> <tr style="{!IF(Case.Labour_Charges__r.size > 0, '', 'display:none')}"> <td colspan="2"> <br /> <b>Labour:</b> <table class="itemTable"> <tr> <th>Date</th> <th>Start Time</th> <th>Finish Time</th> <th>Travel Hours</th> <th>Total Hours</th> </tr> <apex:repeat value="{!Case.Labour_Charges__r}" var="l"> <tr> <td> <apex:outputText value="{0,date,dd'/'MM'/'yyyy}"> <apex:param value="{!l.Date__c}" /> </apex:outputText> </td> <td class="text-right">{!HOUR(l.Start_Time__c)}:{!lpad(TEXT(Minute(l.Start_Time__c)), 2, '0')}</td> <td class="text-right">{!HOUR(l.Finish_Time__c)}:{!lpad(TEXT(Minute(l.Finish_Time__c)), 2, '0')}</td> <td class="text-right">{!l.Total_Travel_Hours__c}</td> <td class="text-right">{!l.Total_Combined_Hours__c}</td> </tr> </apex:repeat> </table> </td> </tr>
example of the issue above
many thansk
mark
For breaking lines use <br/> tag above labour table start.
If required use many breakers until the table comes to next page like <br/><br/><br/><br/>... For emergency follow this step. Later I will update you with shot solution. And confirm me break is working fine or not.
Regards
Vijay
thank you for the update, i was hoping to use a more dynamic approach as each report will be different depending on the report actions put into the action section
using something like this below would be better but i just am not sure where i need to add the code or if this is the comeplete code line i need
<div style="page-break-after:always;">
Greetings to you!
You can use page-break-after:always;
Please refer to the below links which might help you further with the above requirement.
http://eltoro.force.com/FormatingPageCreatedUsingApexPageRenderAsPdf
https://www.antennahouse.com/CSSInfo/CSS-Page-Tutorial-en.pdf
https://salesforce.stackexchange.com/questions/55591/rendering-a-visualforce-page-as-pdf-and-force-page-breaks
https://salesforce.stackexchange.com/questions/46919/how-to-render-multiple-pdfs-from-a-single-visualforce-page/46922#46922
I hope it helps you.
Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.
Thanks and Regards,
Khan Anas
thanks for the reply
would the following code still work? Where possible i would like to avoid a page break. We only need a page break when the Action text area is big and this forces the Parts or Labour time tables to run so that half the table is on one page and the other half is on the next page
would the code in bold and highlighted now work?
the additional code is on line 06, 11 and 12
After the section Actions Taken (line 144) is where i need to focus. If this component pulls in lots for text from salesforce and the following Parts or Labour charge tables run over a page i need a page break to occur. (see image above for the example)
thanks for you help in advance
Page-Break class is working fine. Thanks .
Mark please add div tag with page-broken class just replacing <br/> at above Labour line(line no:192).I think your page will broken and labour info will print next page.
Please put it and test again.