Client Side Address Validation in Struts

In this lesson we will create JSP page for entering the address and use the functionality provided by Validator Framework to validate the user data on the browser. Validator Framework emits the JavaScript code which validates the user input on the browser. To accomplish this we have to follow the following steps:

Enabling the Validator plug-in: This makes the Validator available to the system.
Create Message Resources for the displaying the error message to the user.
Developing the Validation rules We have to define the validation rules in the validation.xml for the address form. Struts Validator Framework uses this rule for generating the JavaScript for validation.
Applying the rules: We are required to add the appropriate tag to the JSP for generation of JavaScript.
Build and test: We are required to build the application once the above steps are done before testing.

Enabling the Validator plug- in

To enable the validator plug-in open the file struts-config.xml and make sure that following line is present in the file.

<plug-in className="org.apache.struts.validator.ValidatorPlugIn">
          <set-property
            property="pathnames"
           value="/WEB-INF/validator-rules.xml,/WEB-INF/validation.xml"/>
</plug-in>

Creating Message Resources

Message resources are used by the Validator Framework to generate the validation error messages. In our application we need to define the messages for name, Address and E-mail address. Open the Struts\strutstutorial\web\WEB-INF\MessageResources.properties file and add the following lines:
AddressForm.name=Name
AddressForm.address=Address
AddressForm.emailAddress=E-mail address

Developing Validation rules

In this application we are adding only one validation that the fields on the form should not be blank. Add the following code in the validation.xml.

<form name="AddressForm">
    <field property="name"
          depends="required">
         <arg key="AddressForm.name"/>
    </field>
    <field property="address"
         depends="required">
         <arg key="AddressForm.address"/>
     </field>
     <field property="emailAddress"
         depends="required">
        <arg key="AddressForm.emailAddress"/>
     </field>
</form>

The above definition defines the validation for the form fields name, address and emailAddress. The attribute depends="required" instructs the Validator Framework to generate the JavaScript that checks that the fields are not left blank. If the fields are left blank then JavaScript shows the error message. In the error message the message are taken from the key defined in the <arg key=".."/> tag. The value of key is taken from the message resources (Struts\strutstutorial\web\WEB-INF\MessageResources.properties).

Applying Validation rules to JSP

Now create the AddressJavascriptValidation.jsp file to test the application. The code for AddressJavascriptValidation.jsp is as follows:

<%@ taglib uri="/tags/struts-bean" prefix="bean" %>
<%@ taglib uri="/tags/struts-html" prefix="html" %>

<html:html locale="true">
<head>
<title><bean:message key="welcome.title"/></title>
<html:base/>
</head>
<body bgcolor="white">
<html:form action="/AddressJavascriptValidation" method="post" onsubmit="return validateAddressForm(this);">

<div align="left">
<p>
This application shows the use of Struts Validator.<br>
The following form contains fields that are processed by Struts Validator.<br>
Fill in the form and see how JavaScript generated by Validator Framework validates the form.
</p>

<p>
<html:errors/>
</p>
<table>

<tr>
<td align="center" colspan="2">
<font size="4"><b>Please Enter the Following Details</b></font>
</tr>
<tr>
<td align="right">
<b>Name</b>
</td>
<td align="left">
<html:text property="name" size="30" maxlength="30"/>
</td>
</tr>
<tr>
<td align="right">
<b>Address</b>
</td>
<td align="left">
<html:text property="address" size="30" maxlength="30"/>
</td>
</tr>

<tr>
<td align="right">
<b>E-mail address</b>
</td>
<td align="left">
<html:text property="emailAddress" size="30" maxlength="30"/>
</td>
</tr>

<tr>
<td align="right">
<html:submit>Save</html:submit>
</td>
<td align="left">
<html:cancel>Cancel</html:cancel>
</td>
</tr>
</table>
</div>


<html:javascript formName="AddressForm"/>


</html:form>
</body>
</html:html>

The code <html:javascript formName="AddressForm"/> is used to plug-in the Validator JavaScript.

Create the following entry in the struts-config.xml for the mapping the /AddressJavascriptValidation url for handling the form submission through AddressJavascriptValidation.jsp.

<action
     path="/AddressJavascriptValidation"
     type="roseindia.net.AddressAction"
     name="AddressForm"
     scope="request"
     validate="true"
     input="/pages/AddressJavascriptValidation.jsp">
     <forward name="success" path="/pages/success.jsp"/>
</action>

Add the following line in the index.jsp to call the form.

<li>
<html:link page="/pages/AddressJavascriptValidation.jsp">Client Side Validation for Address Form</html:link>
<br>
The Address Form that validates the data on the client side using Stuts Validator generated JavaScript.
</li>

Building Example and Testing

To build and deploy the application go to Struts\strutstutorial directory and type ant on the command prompt. This will deploy the application. Open the browser and navigate to the AddressJavascriptValidation.jsp page. Your browser should show the following out put.

If the fields are left blank and Save button is clicked, browser shows the error message.

In this lesson you learned how to use Struts Validator Framework to validate the form on client browser.