Input form validation in magento

As you know Magento use Prototype as javascript library.  It provides a simple way to validate html form values.

Below is an example:

<form name=”my-form” id=”my-form” method=”post”>
<label for=”firstname”>
< ?php echo $this->__(‘First name’) ?> <span>*</span></label><br />
<input  id=”firstname” name=”firstname” class="input-text required-entry"/>

<label for=”lastname”>
< ?php echo $this->__(‘Last name’) ?> <span>*</span></label><br />
<input  id=”lastname” name=”lastname” class="input-text required-entry"/>

</form>

<script type=”text/javascript”>
//< ![CDATA[
var customForm = new VarienForm(‘my-form‘);
//]]>
</script>

In the form above you can see each input field has its own class name and these classes will be used to validate field’s value. There are many predefined classes like that in prototype lib. I’ll show you all of them at the end of this topic.

Most important thing besides assigning class names is that little piece of JavaScript below the form. Remember to pass form id into the new VarienForm object.

Basically that’s it. Constructing the form this way, automatically makes your form reuse already existing validation code, the one that the rest of the shop is using.

Below is a full list of validate class and its error message that I found in prototype lib.

• validate-select

Please select an option.

• required-entry

This is a required field.

• validate-number

Please enter a valid number in this field.

• validate-digits

Please use numbers only in this field. please avoid spaces or other characters such as dots or commas.

• validate-alpha

Please use letters only (a-z or A-Z) in this field.

• validate-code

Please use only letters (a-z), numbers (0-9) or underscore(_) in this field, first character should be a letter.

• validate-alphanum

Please use only letters (a-z or A-Z) or numbers (0-9) only in this field. No spaces or other characters are allowed.

• validate-street

Please use only letters (a-z or A-Z) or numbers (0-9) or spaces and # only in this field.

• validate-phoneStrict

Please enter a valid phone number. For example (123) 456-7890 or 123-456-7890.

• validate-phoneLax

Please enter a valid phone number. For example (123) 456-7890 or 123-456-7890.

• validate-fax

Please enter a valid fax number. For example (123) 456-7890 or 123-456-7890.

• validate-date

Please enter a valid date.

• validate-email

Please enter a valid email address. For example johndoe@domain.com.

• validate-emailSender

Please use only letters (a-z or A-Z), numbers (0-9) , underscore(_) or spaces in this field.

• validate-password

Please enter 6 or more characters. Leading or trailing spaces will be ignored.

• validate-admin-password

Please enter 7 or more characters. Password should contain both numeric and alphabetic characters.

• validate-cpassword

lease make sure your passwords match.

• validate-url

Please enter a valid URL. http:// is required

• validate-clean-url

Please enter a valid URL. For example http://www.example.com or http://www.example.com

• validate-identifier

Please enter a valid Identifier. For example example-page, example-page.html or anotherlevel/example-page

• validate-xml-identifier

Please enter a valid XML-identifier. For example something_1, block5, id-4

• validate-ssn

Please enter a valid social security number. For example 123-45-6789.

• validate-zip

Please enter a valid zip code. For example 90602 or 90602-1234.

• validate-date-au

Please use this date format: dd/mm/yyyy. For example 17/03/2006 for the 17th of March, 2006.

• validate-currency-dollar

Please enter a valid $ amount. For example $100.00.

• validate-one-required

Please select one of the above options.

• validate-one-required-by-name

Please select one of the options.

• validate-not-negative-number

Please enter a valid number in this field.

• validate-state

Please select State/Province.

• validate-new-password

Please enter 6 or more characters. Leading or trailing spaces will be ignored.

• validate-greater-than-zero

Please enter a number greater than 0 in this field.

• validate-zero-or-greater

Please enter a number 0 or greater in this field.

• validate-cc-number

Please enter a valid credit card number.

• validate-cc-type

Credit card number doesn\’t match credit card type

• validate-cc-type-select

Card type doesn\’t match credit card number

• validate-cc-exp

Incorrect credit card expiration date

• validate-cc-cvn

Please enter a valid credit card verification number.

• validate-data

Please use only letters (a-z or A-Z), numbers (0-9) or underscore(_) in this field, first character should be a letter.

• validate-css-length

Please input a valid CSS-length. For example 100px or 77pt or 20em or .5ex or 50%

• validate-length

Maximum length exceeded.

Source:http://www.magestore.com/blog/2010/04/09/form-validation-on-magento/