Out of the box Form Validation in

Magento
 Jul 16, 2014  Petar Sambolek  Frontend, Magento

Magento uses Prototype library to manage form validation. This comes in handy, because all
you need to do when writing custom form is to assign a valid class names to your input
fields, and pass the form id to VarienForm object.

Let’s look at this example of validation in Magento.

<form name="test‐form" id="my‐custom‐form" action="" method="post">

<label for="firstname"><?php echo $this‐>__('First name') ?> <span class="required">*</span></label><br /

<input id="firstname" name="firstname" class="input‐text required‐entry" />

<label for="lastname"><?php echo $this‐>__('Last name') ?> <span class="required">*</span></label><br />

<input id="lastname" name="lastname" class="input‐text required‐entry" />

<label for="useremail"><?php echo $this‐>__('Email') ?> <span class="required">*</span></label><br />

<input type="text" name="useremail" id="useremail" class="input‐text required‐entry validate‐email" />

</form>

<script type="text/javascript">

//< ![CDATA[

var customForm = new VarienForm('my‐custom‐form');

</script>

I also took some time to extract all validation rules you can use, and their error message. You
can find the methods yourself by looking in js/prototype/validation.js on line 414

'validate‐no‐html‐tags' => 'HTML tags are not allowed'

'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 chara

'validate‐digits‐range' => 'The value is not within the specified range.'

'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 fie
'validate‐alphanum' => 'Please use only letters (a‐z or A‐Z) or numbers (0‐9) only in this field.

'validate‐alphanum‐with‐spaces' => 'Please use only letters (a‐z or A‐Z), numbers (0‐9) or spaces only in thi

'validate‐street' => 'Please use only letters (a‐z or A‐Z) or numbers (0‐9) or spaces and # onl

'validate‐phoneStrict' => 'Please enter a valid phone number. For example (123) 456‐7890 or 123‐456‐

'validate‐phoneLax' => 'Please enter a valid phone number. For example (123) 456‐7890 or 123‐456‐

'validate‐fax' => 'Please enter a valid fax number. For example (123) 456‐7890 or 123‐456‐78

'validate‐date' => 'Please enter a valid date.'

'validate‐email' => 'Please enter a valid email address. For example [email protected].'

'validate‐emailSender' => 'Please use only visible characters and spaces.'

'validate‐password' => 'Please enter 6 or more characters. Leading or trailing spaces will be ign

'validate‐admin‐password' => 'Please enter 7 or more characters. Password should contain both numeric a

'validate‐both‐passwords' => 'Please make sure your passwords match.'

'validate‐url' => 'Please enter a valid URL. Protocol is required (http://, https:// or ftp:

'validate‐clean‐url' => 'Please enter a valid URL. For example http://www.example.com or www.examp

'validate‐identifier' => 'Please enter a valid URL Key. For example "example‐page", "example‐page.h

'validate‐xml‐identifier' => 'Please enter a valid XML‐identifier. For example something_1, block5, id‐

'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‐zip‐international' => 'Please enter a valid zip code.'

'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 number 0 or greater in this field.'

'validate‐zero‐or‐greater' => 'Please enter a number 0 or greater in this field.'

'validate‐greater‐than‐zero' => 'Please enter a number greater than 0 in this field.'

'validate‐state' => 'Please select State/Province.'

'validate‐new‐password' => 'Please enter 6 or more characters. Leading or trailing spaces will be ign

'validate‐cc‐number' => 'Please enter a valid credit card number.'

'validate‐cc‐type' => 'Credit card number does not match credit card type.'

'validate‐cc‐type‐select' => 'Card type does not match credit card number.'

'validate‐cc‐exp' => 'Incorrect credit card expiration date.'

'validate‐cc‐cvn' => 'Please enter a valid credit card verification number.'

'validate‐ajax' => ''

'validate‐data' => 'Please use only letters (a‐z or A‐Z), numbers (0‐9) or underscore(_) in t

'validate‐css‐length' => 'Please input a valid CSS‐length. For example 100px or 77pt or 20em or .5e

'validate‐length' => 'Text length does not satisfy specified text range.'

'validate‐percents' => 'Please enter a number lower than 100.'

'validate‐cc‐ukss' => 'Please enter issue number or start date for switch/solo card type.'
In case you would want to add your custom validation rule, just create a javascript file with
any name you want in js folder of your Magento installation. I’ll show you how to do this in
the following example.

Say you want to modify one of the validation rules, the best way would be to create a
method with a same name and load it after the original method. This way, all calls would
be redirected to your method instead of the original. Just be careful if you’re overriding
validation rules like this, because javascript is only client-side validation. Your may have
your server validate the field as well – which can cause some errors even though the value in
field was entered the way you wanted.
So, be sure to test your validation rule.

For our purposes, we’ll override Magento’s validate-email method. We want it to accept only
email addresses ending with @gmail.com.

Let’s create our javascript file and place it in the js folder.

js/inchoo.js

Validation.add('validate‐email', 'Please enter a valid Gmail address. For example [email protected].',

return Validation.get('IsEmpty').test(v) || /^([a‐zA‐Z0‐9]+[a‐zA‐Z0‐9._%‐]*@gmail\.com)$/i.test(v)

All we need to do now is include our validation script. We’ll do that using Magento’s addJs
method which will add the javascript file to our website’s head.

<default>
<reference name="head">

<action method="addJs"><script>inchoo.js</script></action>
</reference>

</default>

You can do this from any layout file (preferably your module’s layout file), Magento did it in
their theme’s layout page called page.xml located in
app/design/frontend/base/default/layout/page.xml

Hope this clears some things up for you. At the very least, you now have a list of all validation
classes in Magento.