APEX validations allow a server-side validation to occur for a number of different conditions - item not null, item is numeric/alphanumeric, regular expressions, etc. When a validation fails, you have four options to display the corresponding error message:
With a simple template modification, you can create a fifth option, which is a variation of option #3 above. It will still display the message in the notification, but only highlight the label of the item in question.
This allows for a couple of things: first, if you have a form with a number of items and a fixed width template, error messages inline with items will wreak havoc on the layout, pushing items off to the right and misalign your entire page. By only highlighting the label of the item in question, the user is aware of where the issue is, and can simply look in the notification region to understand what needs to be done to correct the issue.
Here's a screenshot of a page with three items that have NOT NULL validations associated with them. The label template denotes that each of these fields are NOT NULL with the "*" prefix.
And when the page is submitted without any values, here is the result:
Notice that no error messages are displayed inline; only the labels are highlighted in a pink color, denoting that there is an issue with each one. Reading the notification will explain what each of the issues are and potentially offer advise on how to correct them.
This trick is achieved with a simple modification to the Required Label Template that you are using on your page. The changes are quite simple; all that needs to be modified is the Error Display section, as illustrated below:
In this example, I simply added a style tag (style="background-color:#ffa0a7;")to the On Error Before Label attribute. This is what changes the background color to pink for a specific label. You can add any additional attributes here to do whatever you would like to.
Just as important as what was added is what was removed. The token for the actual error message - #ERROR_MESSAGE# - was removed from the On Error After Label attribute. Thus, when APEX renders an item with this Error Template, the only thing that changes is the background color; the Error Message is not added.
- Inline with Field
- Notification Message
- Both inline with field & Notification Message
- Separate Error Page
This allows for a couple of things: first, if you have a form with a number of items and a fixed width template, error messages inline with items will wreak havoc on the layout, pushing items off to the right and misalign your entire page. By only highlighting the label of the item in question, the user is aware of where the issue is, and can simply look in the notification region to understand what needs to be done to correct the issue.
Here's a screenshot of a page with three items that have NOT NULL validations associated with them. The label template denotes that each of these fields are NOT NULL with the "*" prefix.
And when the page is submitted without any values, here is the result:
Notice that no error messages are displayed inline; only the labels are highlighted in a pink color, denoting that there is an issue with each one. Reading the notification will explain what each of the issues are and potentially offer advise on how to correct them.This trick is achieved with a simple modification to the Required Label Template that you are using on your page. The changes are quite simple; all that needs to be modified is the Error Display section, as illustrated below:
In this example, I simply added a style tag (style="background-color:#ffa0a7;")to the On Error Before Label attribute. This is what changes the background color to pink for a specific label. You can add any additional attributes here to do whatever you would like to.Just as important as what was added is what was removed. The token for the actual error message - #ERROR_MESSAGE# - was removed from the On Error After Label attribute. Thus, when APEX renders an item with this Error Template, the only thing that changes is the background color; the Error Message is not added.
Comments
I'm not sure, as it does remove the message inline from the field. You can use other things besides color - for instance, prefix the label with a character - if that is your concern.
Hope this helps,
- Scott -
How to i achieve the same for client-side(Application) custom validation errors.
Not sure what you mean by that - are you referring to JavaScript validations?
Thanks,
- Scott -
I am referring to CONDITIONAL VALIDATIONS under Page_Processing. I am able to show error messages but not able to highlight the label, is there a way to do this?
Thanks
Jay