Archive for October, 2010

Custom Validation Messages for jquery-validate plugin

Tuesday, October 5th, 2010

The jquery.validate plugin allows us to define our own custom validation methods and messages like this:

$.validator.addMethod("equal_to", function(value, element, params) {
    return value == condition;
}, message);

The interesting thing here is that message can be a function. We have complete access to the value, element and parameters of the input validation method.

Assuming our HTML is this:

<input type="text" equal_to="obj_id" />

Our equal_to method can be written like this:

var message = function(value, element, params) {
   var expected = document.getElementById(params).value;
   return value + " is not equal to " + expected;
}

This feature is useful when trying to implement validation methods, like greater_than_element or greater_date, that need additional information to generate their validation messages.