Magento js validation message translation

Magento includes the translator library to translate the js messages that appear on our site.
The translator js is already included at the head.
To translate our messages, we just need to add the text to transator.
For eg:
This translator code needs to be added on our phtml file.
 Translator.add('Select a color.', "<?php echo $this->__('Select a color.');?>");

Then we need to add the text to translate at locale file i.e translate.csv at the locale folder.

However, this will not work for prototype js validation messages that appear on checkout pages.
e.g. "This is a required field." etc.

To translate these validation messages, we need to we’ll override Magento’s validate method.
For that, we need to create an external js file and place it under js folder.

For eg: js/lib/translatejs.js

Validation.addAllThese([
    ['validate-no-html-tags', Translator.translate('HTML tags are not allowed'), function(v) {
return !/<(\/)?\w+/.test(v);
}],
['validate-select', Translator.translate('Please select an option.'), function(v) {
                return ((v != "none") && (v != null) && (v.length != 0));
            }],
    ['required-entry', Translator.translate('This is a required field.'), function(v) {
                return !Validation.get('IsEmpty').test(v);
            }],
    ['validate-number', 'Please enter a valid number in this field.', function(v) {
                return Validation.get('IsEmpty').test(v)
                    || (!isNaN(parseNumber(v)) && /^\s*-?\d*(\.\d*)?\s*$/.test(v));
            }]
]);


For translation to work, we need to add the translations at header.phtml file.

Translator.add('This is a required field.', $this->__('This is a required field.'));
Translator.add('Please select an option.', $this->__('Please select an option.'));

These text should be in our translate csv file.


Finally, the translatejs.js file should be included. I have included it at footer.phtml because the translator should be initialized first.

<script type="text/javascript" src="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_JS);?>lib/translatejs.js"></script>

We can also modify the messages using the above method.