Skip to content

Instantly share code, notes, and snippets.

@bsimpson
Created April 5, 2012 17:40
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bsimpson/2312761 to your computer and use it in GitHub Desktop.
Save bsimpson/2312761 to your computer and use it in GitHub Desktop.
Error message display

Introduction

Error messages are currently not handled in a consistent manner in Batchdeux's forms. I have modified the field_error_proc method which serves as a global way to change the behavior of form errors. By modifying this, I have given us the option to display errors in several ways:

Demo

git fetch
git checkout bls/23176299_data_validation_errors

Be sure to restart your webserver, as changes have been made to the config/ directory

Showing arbitrary errors can be done without needing to pass any parameters to the input fields. This will effectively prevent inline errors, allowing for further control over exactly when/where the errors are displayed. An example of showing all errors attached to :base on a @contact instance is shown below:

<% if @contact.errors.on(:base).present? %>
  <ul class="errors">
    <li><%= @contact.errors.on(:base) %></li>
  </ul>
<% end %>

Using the error_before option:

<input type="text" name="foo" class="error_before">
becomes
<label for="foo" class="errorText">can't be blank</label>
<input class="error_before error" name="foo">

Using the error_after option:

<input type="text" name="foo" class="error_after">
becomes
<input class="error_after error" name="foo">
<label for="foo" class="errorText">can't be blank</label>

Using the suppress_error option:

<input type="text" name="foo" class="suppress_error">
becomes
<input class="suppress_error error" name="foo">

Options

Options can be passed on an individual :input basis.

  • suppress_error - Do not show any inline errors
  • error_before - Show the label tag before the :input tag
  • error_after (default) - Show the label tag after the :input tag

We can expand these options in the future if needed.

Implementation

config/initializers/client_side_validations.rb contains an override for ActionView::Base.field_error_proc

This method uses Nokogiri to parse the HTML tag and look at the CSS class attribute's value. Specifically it is looking for one of the options above to determine how to render the error.

The html_tag has an appended class of error, and the label is placed according to the options (before, or after the :input, or not at all). The :input.error has been styled to display a border of 1px solid red on the :input being rendered.

Deprecation

  • Formtastic (semantic_form_for) will no longer be used going forward. Forms that use semantic_form_for do not call field_error_proc, which is our global error display setting. Formtastic errors are hard-coded to use a certain style.
@goldenmeanie
Copy link

Ben, this is a tremendous improvement (for me at least) over the old system. Thank you for taking the time to think this through and then to walk through it again with me!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment