twitter bootstrap - How to change the default rails error div "field_with_errors"

Question

I'm using sorcery for authentication along with twitter bootstrap.

I'd like to style my error messages on my signup form in the style of twitter's bootstrap by changing the default rails <div class="field_with_errors"> that gets added to the DOM.

What's the rails convention for doing something like this?

I suppose you could add some javascript that manipulates the DOM to rename <div class="field_with_errors">, but that seems like a hack. It seems like there should be a way to override this in rails, but I can't figure out where to do that.

This is how bootstrap requires you to mark up your error to use its built in form error styles:

<div class="control-group error">
  <label class="control-label" for="inputError">Input with error</label>
  <div class="controls">
    <input type="text" id="inputError">
    <span class="help-inline">Please correct the error</span>
  </div>
</div>

Answer 1

From the link above, if you put the following inside class Application < Rails::Application of config/application.rb

config.action_view.field_error_proc = Proc.new { |html_tag, instance| 
  "<div class="field_with_errors control-group error">#{html_tag}</div>".html_safe
}

Your input tags will have a red marker around them whenever validation fails