multiple field validations…with one error message

Question

I need to validate 3 textfields and show red border highlights on the fields but a common error message to show after all 3 fields have been entered.

I have 3 text fields:

<label>LABEL TEXT</label>
<input type="text" value="" size="2" maxlength="2" class="formInput" name="code1" />
<input type="text" value="" size="2" maxlength="2" class="formInput" name="code2" />
<input type="text" value="" size="2" maxlength="2" class="formInput" name="code3" />

Field validations:

Are mandatory fields

Only numbers are allowed and exact 2 numbers should be allowed.

Client-side validations:

I need to apply validations on blur and on the click of a submit button it will validate server side.

I need to apply validations in the following manner---- On blur of the first and second, I need to highlight the fields for invalid entries. But show a common error message (label will be replaced with an error message) after blurring/entering the data in all the three fields.

Please ask questions if anything above is NOT clear...any help much appreciated.

Answer 1

suggest using the jquery validator plugin. read the documentation, you can modify the methods to do what you like. there are plenty of examples on these forums to help you see how to use it. as well as online.

http://rocketsquared.com/wiki/Plugins/Validation#Validator