How can I check for exact length using jQuery Validation?

Question

Using the jQuery Validation plugin to validate forms, how would you confirm that a string is exactly X characters long?

Answer 1

Since there is (currently) no built-in method for this, you'd need to add your own method. This would work:

jQuery.validator.addMethod("exactlength", function(value, element, param) {
 return this.optional(element) || value.length == param;
}, jQuery.format("Please enter exactly {0} characters."));

Which could then be used like this:

$("#formtovalidate").validate({
  rules: {
    somefield: {
      exactlength: 10
    }
   });

Update - How it Works

I've been asked how this works. I don't know all the details; I modeled this method on previously existing ones. However, this is my best attempt to explain it.

• The function takes in value, element, and param.
  • value is the value entered in the field being validated
  • element is the field itself
  • param is whatever comes after the rule type and colon. In the example above, it's the 10 in exactlength: 10
• The next line is a return statement. This will give the final verdict of the validation method back to the code that called it. Any validation method that returns true is saying 'this field passes validation!' It will return the value of the line it's on.
• The return is followed by two declarations, separated by an 'or' operator (||).
  • The || operator means 'evaluate the item left of this. If it's true, return true. If not, try the one on the right. If it's true, return true. Otherwise, return false.'
    • The item on the left is this.optional(element). If the element is not required in your rules, this will return true, and so will the validation. Which means 'If I don't tell you that this field is required, I don't care whether it validates.'
    • If the field is required, we move to the right side of the ||. This is the actual validation test. It compares the length of the field's input with the length you specified it should be. If they are the same, it returns true, the method returns true, and validation passes. Otherwise, validation fails.

That's about it. For further help, see the documentation, particularly the part about custom validation methods.