Depending on the value of a picklist I'd like to toggle a set of fields from required to not required. I've been able to add the divs to make it look required 'red bar in inputField'. Its still not actually being required though. Before I write my own validation I wanted to see if there's an easier way to do this that I'm not thinking of.

Here's what I have right now:

function setRequiredPaymentFields() {
        var paymentMethod= $j("[id$='paymentMethod']").val();

        if (paymentMethod=='Credit Card') {
            $j('.creditCard').show().wrap('<div class="requiredInput"/>').before('<div class="requiredBlock"></div>');


Any suggestions?

  • off topic: I would just add a class "payment-method" to all items whose id end in paymentMethod and ditch the $= selector.
    – Phil Rymek
    Commented Nov 16, 2012 at 19:02

2 Answers 2


You can use a combination of the required attribute and <apex:actionFunction> to enforce conditional required behaviour.

Here is an example with Account as StandardController, where the Account Phone becomes mandatory, if the Account Type is 'Other', reverts back to not mandatory otherwise.

 <apex:page StandardController="Account">

function setRequired(){
    if(document.getElementById('{!$Component.theForm.thePageBlock.thePageBlockSection.accPhone}').value == '') 
    document.getElementById('{!$Component.theForm.thePageBlock.thePageBlockSection.accPhone}').value = '0';


      <apex:form id="theForm">

      <apex:actionFunction name="reRenderBlock" rerender="thePageBlock"/>

      <apex:pageBlock id="thePageBlock">
      <apex:pageBlockSection id="thePageBlockSection">
      <apex:inputField id="accPhone" value="{!Account.Phone}" required="{!Account.Type == 'Other'}"/>
      <apex:inputField value="{!Account.Type}" onchange="setRequired();"/>



(The only slight quirk I've had to use is set the field value to '0' when it is blank, and when the field needs to change back to non-required, because it would give you an error for a missing value or else)

  • Awesome, I'll be trying this tomorrow for sure, looks really promising and way less hackish then the direction I was going. I was in the process of simulating the standard validation and error messaging in javascript.
    – Phil B
    Commented Nov 16, 2012 at 22:45
  • Awesome, hope it works out for you. Commented Nov 16, 2012 at 22:46
  • 1
    @techtrekker Wow! document.getElementById('{!$Component.theForm.thePageBlock.thePageBlockSection.accPhone}') You must be a purist at heart. :)
    – zjeh
    Commented Nov 17, 2012 at 0:00
  • So I gave it a try and it works as you described. The only issue is I don't want the fields to be saved with a '0' value (or the picklists to an arbitrary choice). Any ideas on how I could avoid this? All I can think of is keeping a list of the fields I set to '0' and setting them back to null values when saving.
    – Phil B
    Commented Nov 18, 2012 at 0:11
  • 1
    I came up with a fix. onComplete of the actionFunction I call a javascript function that checks if the field values are '01' if they are, it sets them back to null. The reason I ended up using '01' instead of '0' is if one of the fields is a picklist it sets it to the first value.
    – Phil B
    Commented Nov 18, 2012 at 1:45

I would suggest using Salesforce's validation rules. These server-side rules can be very complex if needed and are easier to maintain than JavaScript though they cannot dynamically alter a page's appearance.


Response to question in comments: Validation rules cannot be set specifically by pages, but one workaround is to use Record Types. Using Opportunities as an example, if the Record Type Normal used the standard pages but Special needed the validation you would just add that as a check in the validation rule. If there are no differences to distinguish the records that might make a validation rule impossible.

I highly recommend that validation rules be consistent regardless of the UI, otherwise you risk having inconsistent/bad data.

  • 1
    Unfortunately I only need to require the fields on this Visualforce page not on the regular page layout. I would like to toggle two sets of fields to required/not required depending on the value of a picklist. I'm not an expert at validation rules though, do you believe something close to this could be achieved using them?
    – Phil B
    Commented Nov 16, 2012 at 19:27
  • Updated my answer with a response.
    – Mike Chale
    Commented Nov 16, 2012 at 19:55

You must log in to answer this question.

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