Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Set of Rails helpers for unobtrusive frontend validations using HTML5 attributes, Rails 3 validators and JavaScript.

branch: master
README.md

ValidatedFields

ValidatedFields is a set of helpers for unobtrusive frontend validations using HTML5 attributes, Rails 3 validators and JavaScript.

It overrides the default Rails form helpers and uses validator reflection to gather validation rules declared in model classes.

Usage

Here's a basic example, just to give you an idea what the plugin does:

class User < ActiveRecord::Base
  validates :name, :presence => true, :message => 'Name is required'
end

<%= form_for(@user, :validate => true) do |f| %>
  <%= f.text_field :name %>
<% end %>

The rendered text field would look like this:

<input class="validated" data-validates="presence" data-error-presence="Name is required" id="user_name" name="user[name]" required="required" type="text" />

With these custom attributes in place, we can easily validate the field using JavaScript. The gem comes with a prepackaged jQuery validator you can easily adjust to your needs.

rails generate validated_fields:javascript

The command above will install validated-fields.js file in your public/javascripts/ directory. Include that file in your views and implement validation callbacks:

$(document).ready(function() {
new ValidatedFields(
    // function called when validation fails
    function(element, errorMsg) {
        element.css('border', '1px red solid');
      element.next('span.error').html(errorMsg); // show error message
    },

    // function called when validation succeeds
    function(element) {
        element.css('border', '1px green solid');
        element.next('span.error').html(''); // clear error message
    }
);

});

Installation

Add the following line to your Gemfile and run bundle install:

gem 'validated_fields', :git => 'http://github.com/alluniq/validated-fields.git'

Standard validation

By default validated-fields supports the following built-in validators:

  • presence
  • format
  • length
  • numericality

Custom validator classes

If you'd like use your own validators, you'll need to create a module with prepare_options method:

class EmailValidator < ActiveModel::EachValidator
  EMAIL_REGEX = /^([^@\s]+)@((?:[-a-z0-9]+\.)+[a-z]{2,})$/i

  def validate_each(record, attribute, value)
    record.errors[attribute] << (options[:message] || "invalid email format") unless value =~ EMAIL_REGEX
  end
end

class User
  validates :email, :email => true
end

module ValidatedField
  module Validators
    module EmailValidator
      def self.prepare_options(validator, options)
        options[:pattern] = EmailValidator.EMAIL_REGEX.inspect
        options["data-error-email"] = validator.options[:message] if validator.options[:message].present?
        options
      end
    end
  end
end

You can customize the JavaScript validator as well. Once you have the required validator helper, extend the ValidatedFields class with your new validation methods:

ValidatedFields.prototype = {

  validateEmail: function(element, errors) {
      var value   = jQuery.trim(element.attr('value'));

        if (notValid) {
            this.errorCallback(element, errors["email"]); // data-error-email
            return false;
        }

        return true;
  }

};

Note on Patches/Pull Requests

  • Fork the project.
  • Make your feature addition or bug fix.
  • Add tests for it. This is important so I don't break it in a future version unintentionally.
  • Commit, do not mess with rakefile, version, or history. (if you want to have your own version, that is fine but bump version in a commit by itself I can ignore when I pull)
  • Send me a pull request. Bonus points for topic branches.
Something went wrong with that request. Please try again.