Question

I’m working with a custom form in Salesforce and have come across a stumbling block in making optional fields turn into required fields dynamically if a certain checkbox is checked.

For example, if a user checks the Electronic Funds Transfer option for payment, all of the fields related to EFT should then become enabled and Apex should display them as required fields (as in not optional).

I am currently enabling the fields using jQuery, but am having a difficult time finding examples of how to change the fields into Apex-required fields.

Thanks for any help or leads on solving this issue.

Answer 1

Would Validation Rules work for you? You could have a Validation rule for each dynamically required field that takes the checkbox into consideration. That would take care of the server-side validation, but you would need to take care of the client side separately if you’re using anything other than Apex Classes and Extensions (like JavaScript or jQuery) to submit the data.

To take advantage of the default CSS Styling Visualforce provides, add the “error” class to the input element if the user tries to save without entering a value.

Here’s an code snippet of how I would approach the client side validation (using jQuery in noConflict mode as j$):

// check required fields
j$(RequiredFields).each(function(index,field)
{
    if(!(field.val() && field.val() != "" && field.val() != "--None--")) { field.addClass("error"); RequiredFieldsInError.push(field); } 
    else { field.removeClass("error"); }
});

if(RequiredFieldsInError.length > 0)
{
    var RequiredFieldLabels = [];

    j$(RequiredFieldsInError).each(function(index,field){
        var RequiredFieldLabel = j$("label[for$="+j$(field).attr('id')+"]").html().trim(); RequiredFieldLabels.push(RequiredFieldLabel);
        field.after("<div id='"+field.attr("id")+"_error' class='errorMsg' >"+RequiredFieldLabel+" is Required.</div>");
    });

    if (RequiredFieldLabels.length > 1) {
        RequiredFieldLabels[RequiredFieldLabels.length - 1] = "and " + RequiredFieldLabels[RequiredFieldLabels.length - 1];
    }

    j$("#ErrorSummary")
        .html(RequiredFieldLabels.join(", ")+" "+(RequiredFieldLabels.length > 1 ? "are" : "is a")+" required field(s). ")
        .css("color","#CC0000");

    return;
}