Customize Error Message with Simple_Form

Customize error message with simple_form

You can easily change the default error message comes in the translation file, which is found in config/locales/simple_form.en.yml.

In the specific initializer, config/initializers/simple_form.rb you can overrule the default options how the html is generated.

Hope this helps.

For completeness, I would like to add that formtastic is an easier choice to start with, because it has a default layout. I like simple_form a lot, but it does not offer any formatting out of the box, but that is their intention. With Formtastic it is very hard (impossible) to change the generated html, and with simple_form can you can completely mold the generated html to your liking. This is especially useful if you have a designer, and the forms you generate have to generate the same html. So if you are getting started, formtastic will give you nicer-looking results quicker. Also note that it is quite easy to switch, because the syntax is almost identical.

Editing simpleform locales to enable custom error messages

Simple_form does nothing special for validation error messages I18n and leaves all work to the default Rails I18n processing. The simple_form.en.yml localization file only deals with the various options to display the form and its elements (labels, hints, etc., see the docs) and has nothing to do with error messages.

So, if you need to set the error messages localization, have a look at the official Rails guide on I18n instead. Actually, I think that your simple_form.en.yml example might work, if you moved the error message localizations to the default Rails locale file for English: config/locales/en.yml.

simple_form and custom validation message

I would recommend you use a form object where you don't need to save errors in the base of the object. You would just create new attributes with those validations and add it to the view which would work out of the box with simple_form.

Display error messages in rails simple_form

You can specify in your simple_form.rb initializer file with which tag your error message will be wrapped:

b.use :error, :wrap_with => { :tag => :span, :class => :error }

Also you can disable default error component on the input and print it by yourself like this:

<%= simple_form_for @user do |f| %>
  <%= f.input :name, error: false %>
  <%= f.error :name %>
  <%= f.submit %>
<% end %>

and style your error message like you want.

Show full messages on simple_form

Upon inspection, I found out that you can configure this globally:

config/initializers/simple_form.rb

SimpleForm.setup do |config|
  config.wrappers :default, class: :input,
    hint_class: :field_with_hint, error_class: :field_with_errors do |b|
    # ...
    # ...
    # COMMENT THIS LINE JUST LIKE THIS:
    # b.use :error, wrap_with: { tag: :span, class: :error }

    # THEN UNCOMMENT THIS LINE JUST LIKE THIS:
    b.use :full_error, wrap_with: { tag: :span, class: :error }
  end
end

Tested working.

how do I align my error message with Simple_form for Ruby on Rails?

I managed to get my errors displaying in the label above the input box.

With the code below I've given my errors a class, which can be formatted as to positioning etc, but there was always a blank div or something under the input box, which put the other input boxes under it out of joint.

<%= f.input :name, :required => true, :label_html => { :class => 'edit_form_titles' }, :error_html => { :class => 'cant_be_blank'} %>

In my initializers/simple_form.rb there was:

  config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
    b.use :html5
    b.use :placeholder
    b.use :label
    b.wrapper :tag => 'div', :class => 'controls' do |input|
      input.use :input
      input.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
      input.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
    end
  end

I changed this to:

 config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
    b.use :html5
    b.use :placeholder
    b.wrapper :tag => 'div', :class => 'label-error' do |input|
      b.use :label
      b.use :error, :wrap_with => { :tag => 'span', :class => 'help-block' }
    end
    b.wrapper :tag => 'div', :class => 'controls' do |ba|
      ba.use :input
      ba.use :hint,  :wrap_with => { :tag => 'p', :class => 'help-block' }
    end
  end

That got rid of the blank empty space under the input box and I could format my cant_be_blank class so the text appears exactly next to the text in my label.

Simple_Form display validation error messages next to different input field

I eventually found out about the append block in simple_form (buried in a pull request, not documented anywhere else that I could find). Basically, you can use that to append whatever markup you want to your f.input. I did the following, which is pretty hacky, but it does what I need it to do:

<%= f.input :customer, required: true,
    wrapper_html: { class: ("error" if @booking.errors[:customer_id].any?) } do %>
  <%= f.input_field :customer, value: @booking.customer_name %>
  <%= f.error :customer_id %>
<% end %>

First, I had to conditionally add the class "error" to the wrapper if there were any errors on the related field, then I used the append block to render out the input field, followed by the errors for the related field from the model. Hope this helps someone in the future!

---

Related Topics