VFP
Position elements side by side within a single pageBlockSection column
LINK
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
<apex:pageBlockSection title="Search Payment" columns="2" id="pbs0"> <!--script>twistSection(document.getElementById("{!$Component.pb0.pbs0}").childNodes[0].childNodes[0]); </script--> <apex:inputField value="{!PaymentResponseObj.Source_System__c}" /> <apex:inputField value="{!PaymentResponseObj.Invoice_Number__c}" /> <!--apex:inputField value="{!PaymentResponseObj.Invoice_Date__c}" label="Invoice Date" /--> <!--apex:pageblockSection > <apex:inputField value="{!PaymentResponseObj.Invoice_Date__c}" label="From Invoice Date" /> <apex:inputText value="{!invoiceDateTo}" id="dateTo" label="To Invoice Date" onfocus="DatePicker.pickDate(false, this, false);"> <apex:param value="{!invoiceDateTo}" /> </apex:inputText> </apex:pageblockSection--> <apex:pageBlockSectionItem> <apex:outputLabel value="Invoice Date" for="first" /> <apex:panelGrid columns="2"> <apex:inputField value="{!PaymentResponseObj.Invoice_Date__c}" style="width: 140px;" html-placeholder="From Invoice Date" /> <br></br> <apex:inputText value="{!invoiceDateTo}" id="dateTo" html-placeholder="To Invoice Date" onfocus="DatePicker.pickDate(false, this, false);"> <apex:param value="{!invoiceDateTo}" /> </apex:inputText> </apex:panelGrid> </apex:pageBlockSectionItem> <apex:inputField value="{!PaymentResponseObj.Vendor_Number__c}"/> <apex:inputField value="{!PaymentResponseObj.Vendor_Name__c}"/> <apex:inputField value="{!PaymentResponseObj.WBS__c}"/> <apex:inputField value="{!PaymentResponseObj.GL_Code__c}"/> <apex:inputField value="{!PaymentResponseObj.Cost_Center__c}"/> <apex:inputField value="{!PaymentResponseObj.Amount__c}"/> <apex:inputField value="{!PaymentResponseObj.Amount_Currency__c}" /> <apex:inputField value="{!PaymentResponseObj.Custom_32__c}"/> <apex:inputField value="{!PaymentResponseObj.Rep__c}" /> <apex:selectList value="{!PaymentResponseObj.Payee_Country__c}" size="1" multiselect="false"> <apex:selectOptions value="{!listOfCountry}" /> </apex:selectList> <apex:pageblockSectionItem > </apex:pageblockSectionItem> <apex:pageblockSectionItem > <apex:outputpanel > <div style="text-align: right; margin-bottom: 10px;"> <apex:commandButton style="text-align: center;" reRender="pb0" value="Clear Search" action="{!reset}" /> <apex:commandButton reRender="pb0" value="Search" action="{!search}" status="blockElement"/> </div> </apex:outputpanel> </apex:pageblockSectionItem> <apex:pageblockSectionItem ></apex:pageblockSectionItem> </apex:pageBlockSection> |
Favorite
apex:inputTextarea – required
1 2 3 4 5 6 7 8 9 |
<apex:pageBlockSection columns="2"> <apex:PageBlockSectionItem > <apex:outputlabel value="Amendment Justification"/> <apex:outputPanel styleClass="requiredInput" layout="block"> <apex:outputPanel styleClass="requiredBlock1" layout="block"/> <apex:inputTextarea value="{!o_req['Amendment_Justification__c']}" cols="70" rows="4" required="false" label="Amendment Justification" /> </apex:outputPanel> </apex:PageBlockSectionItem> </apex:pageBlockSection> |
Favorite
Required InputTextArea
I was asked to make an inputtextarea required on a visualforce page and thought, “ok, no problem, 2 minutes!”. In reality, this was kind of a nightmare to implement. My vf page looked something like this:
1 2 3 4 5 6 |
<apex:pageblock id="pageBlock"> <apex: pagblocksection id="pageBlockSec"> <apex:pageblocksectionitem> <apex:outputlabel value="Big Field"> <apex:inputtextarea value="{!myObject__c.Big_Field__c}" required = true id="bigfield"}" ... |
So the first issue is that the iconic redline next to the required field does not display for […]
enum in APEX
1 2 3 4 5 6 7 8 |
global with sharing class My_Controller { public Case currCase {get; set; } public enum StatusValue {RED, YELLOW, GREEN} public StatusValues getColorStatus() { return StatusValue.RED; //demo code - just return red } } |
1 |
<apex:image url='stopsign.png' rendered="{!colorStatus == StatusValue.RED}" /> |
Favorite
Loading message using
1 2 3 4 5 6 7 8 9 10 |
<apex:commabndButton value="search" action="{!doSearch}" reRender="out" status="mystatus" /> <apex:outputPanel id="out"> <apex:actionStatus id="mystatus"> <apex:facet name="start"> <apex:outputText value="loading... please wait!"</apex:outputText> </apex:facet> <apex:facet name="stop"> <!--show the pageblock or etc... --> </apex:facet> |
if you want to display the image you can do that instead of
1 |
<apex:image value="{!$Resource.loading}"</apex:outputText> |
Favorite
apex:actionFunction javascript
1 2 3 |
<apex:actionFunction name="clearFormFn" action="{!clearForm}" status="overlayStatus" rerender="{!$Component.myForm}" /> <apex:actionStatus id="overlayStatus" onstart="showOverlay();" onstop="hideOverlay();"/> |
1 2 3 4 |
public void clearForm() { //more code here.... } |
1 |
<div id="overlay"></div> |
1 2 3 4 5 6 |
<script type="text/javascript"> Sfdc.onReady(function() { SfdcApp && SfdcApp.Visualforce && SfdcApp.Visualforce.VSManager && SfdcApp.Visualforce.VSManager.vfPrepareForms(["myPage:myForm"]); }); </script> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<script type="text/javascript"> //--------------------------------- // Function to display overlay div //--------------------------------- function showOverlay() { var o = document.getElementById('overlay'); o.style.visibility = 'visible'; //create inner div var i = document.createElement('div'); i.id = 'overlayInner'; i.style.position = "fixed"; i.style.top = (o.clientHeight)/2 + 'px'; i.style.left = (o.clientWidth)/2 + 'px'; //append inner div inside overlay div o.appendChild(i); } //--------------------------------- // Function to hide overlay div //--------------------------------- function hideOverlay() { var o = document.getElementById('overlay'); o.style.visibility = 'hidden'; } </script> |
Favorite
overriding standard page
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<apex:page standardController="name_of_the_object__c" id="gp"> <apex:detail subject="{!name_of_the_object__c.Id}" relatedList="true" inlineEdit="true" id="detailgp"/> <apex:includeScript value="{!$Resource.JQuery}"/> <script> var j$ = jQuery.noConflict(); j$("iframe").each(function(){ j$(this).load(function() { j$(this).height( j$(this).contents().find("body").height() ); }); }); </script> </apex:page> |
Favorite
apexpage message utility
1 2 3 4 5 6 7 8 9 10 11 |
public static PageReference showMessage(String message, String msgType) { ApexPages.Message msg; if(msgType == 'Error') { msg = new ApexPages.Message(ApexPages.Severity.ERROR, message); //error } else{ msg = new ApexPages.Message(ApexPages.Severity.INFO, message); //info } ApexPages.addMessage(msg); return null; } |
To use:
1 |
<apex:pageMessages ></apex:pageMessages> |
1 |
showMessage('At least ' + count + ' responses required', 'Error'); |
Favorite
how to retain the checkbox selection in visualforce pagination
First off; create a wrapper class in this example I’ll be using Account standard object: Overall big picture: First on the Visualforce page create apex function with two params. Create a SET variable of id’s(Set some name = new Set) Create two properties (get; set; method properties) for Id and another for boolean. Now the […]
false postive
1 2 3 4 5 6 |
public Boolean isListEmpty { get{ return !(lstEmp==null || lstEmp.isEmpty()); } set; } |
Favorite