Form Error Messages in the Right Place

Overview

The JHTML form wizard adds a block of code to display form errors at the top of the form. It iterates over any form errors and displays the errors in a list. This article shows you how to place your error messages next to the form field which generated them.

Example

Default Form Error Message Handling

This example uses the default form error handling, all the error messages are displayed at the top of the form in an error message foreach loop. This is the default behavior. The purpose of this article is to show you how to place the error messages next to the appropriate form field

Custom Form Error Message Handling

In this example we have the user fill in the form, when there is an error processing the field item we return the form with a relevant error message display just above the relevant form field

How to do Custom Form Error Message Handling

Code Sample

Here's the JHTML code for the First name field in the form above.

<tr>
<td class="label">First name:*</td>
<td>
  <DROPLET BEAN="/atg/dynamo/droplet/IsNull"> 
    <PARAM NAME="value" value="bean:ProfileFormHandler.propertyExceptions.firstName"> 
    <OPARAM NAME="false"> 
      <font color=red>Please enter your name</font><br> 
    </OPARAM> 
  </DROPLET> 
  <INPUT  class="content" TYPE="TEXT" NAME="firstName" SIZE="24" 
          BEAN="ProfileFormHandler.value.firstName" REQUIRED><BR>
</td>
</tr>

We check to see if there is a value in the FormHandler's propertyExceptions map for the field firstName. If there is then we display and error message "Please enter your name" just above the form field.

Simply repeat this process for each form field in your form.

NOTE: The key in the propertyExceptions map is the name of the property specified in the BEAN= tag of the input field.

When you are done, don't forget: You may need to remove the error message for each at the top of your form.