Agile Web Development

Build it. Launch it. Love it.

Client-Side Validation

The plugin reflects validations to generated HTML elements and comes with a client-side JavaScript validator.

Requires Validation Reflection plugin.

This plugin is only a tool, it leaves some work for you to do. The plugin happily handles the validation part, but it is your job to handle the notification.

Let’s look at the simplest case first. In public/javascripts/application.js put:


This installs a validator for each form on the page which has the class "validated". If any of the form’s input elements are or become invalid, they are marked with the class "invalid". If you have something like this

 .invalid {
   border: 1px solid #f00;

somewhere in your stylesheet(s), invalid fields will be marked with a red border. This works for

  • :validates_presence_of
  • :validates_length_of
  • :validates_numericality_of
  • :validates_inclusion_of
  • :validates_format_of - as far as regular expressions are matched the same in Ruby and JavaScript


Repository svn://
License Rails' (MIT)
Rating (10 votes)
Owner Michael Schuerig
Created 14 August 2006


Add a comment