At certain times there is a need to conditionally render visaulforce content on your layouts. In Salesforce such places couble be VisalForce pages, email templates. Before writing custom controllers, let’s check if we can resolve the issue with standard tools.
Step 1: Create a VisualForce Page
As an example, let’s use Accounts and Contacts. On our page, we’d like to show a table with contacts if they exist under the account. If there are no contacts under the account, we’ll show a message that there are no related contacts for this account.
Here is our page as an example:
To render the page, simply click ‘Preview’ button after its saved. It will open a new tab.
Most likely you’ll see empty form. This is because your page is not tied to any of the accounts. To fix that simply add
?id=XXXXXXXXXXXXXXXXXX
where XXXXXXXXXXXXXXXXXX is the ID of one of your accounts.
Full URL will look like: https://c.c23.visual.force.com/apex/vf_page_name?id=XXXXXXXXXXXXXXXXXX
Alright, so once done this page will look like this:
Step 2: Add Variable to Count Related Records
Now, we just need to find out what is the count of related contacts. To do so, we’ll use apex variable with apex repeat. Let’s say our variable will have a name ‘count‘ with initial value ‘0’.
More about variables you can read here.
Now we just need to iterate through all related records and increment our variable by 1 for each record. To do so, we’ll use ‘Apex Repeat‘.
Make sure to add variable before block with related contacts. That way we first get the count of related records. After that we can render other blocks.
So our updated page will have the following look:
As you may’ve noticed, I’ve added one more line that is ‘size is {!count}‘. This is just to double check if our added variable works. After previewing you should see the following:
Step 3: Add ‘Renderer’ Conditions to VF elements
Since our account has just one contact, size will be shown as 1.
To conditionally render elements on our visualforce page we will use ‘Render’ attribute. If we want to render contacts block if the number of contacts greater than 0, we need to use the following:
rendered=”{!count > 0}”
If count is greater than 0, the formula will return ‘true’, otherwise, it will return ‘false’.
The next step is to add notice message that will notify user if there are no related contacts for this account. For this example, we’ll use the apex message, but feel free to use any other elements for your case.
For this notice message we’ll also use renderer attribute, but this time with the opposite criteria:
rendered=”{!count == 0}”
The final markup of the page will look the following:
In case our account does not have related contacts, apex visualforce page will look this way:
Now you’ve learned how to conditionally render certain blocks of your visualforce page based on count of the related records. Obviously, there could be all kinds of variations to rendered attribute. As an example, you could only count contacts that have email address.
All in all, we’d love to hear from you! Let us know your feedback & If you have a better solution – feel free to comment!
Stay tuned for more awesome how to’s.
