Using Minlength and Maxlength with the Validator jQuery Plug-in

Naturally, if you’ve already read the introductory article of this series, then you have a pretty clear idea of how to use the Validator plug-in in for verifying data collected through an HTML form. In that particular tutorial I discussed how to use the “validate()” method (actually, the workhorse of the plug-in) to check a basic contact form composed of the typical “First Name,” “Last Name” and “Email” fields.

As you’ll surely remember, in the first case the “validate()” method was attached to the targeted form, thus performing a basic validation process on all of the pertinent fields, while in a second example the method was called with a “rules” argument, which permitted us to specify much more selectively which fields should be properly checked.

However, using a plug-in that only checks for empty strings on a selected web form is pretty useless, particularly in cases where a stricter validation process is required. Fortunately, the Validator plug-in comes with a neat set of features that allow it to do a few interesting things, such as checking if the data entered into a specific field is a valid URL, or if it’s a correctly-formatted email address, and much more, actually.

So, in this second installment of the series, I’ll be talking a close look at the plug-in’s “minlength” and “maxlength” arguments, which as their names suggest, come in handy for verifying individually if the text entered into a determined field contains at least a certain number of characters, and if it exceeds a specified length.

Now, it’s time to learn how to work with these useful parameters when validating online forms. Let’s get going!