How to Highlight Fields on Rails Validation Errors
Assuming you have an error class for fields in your CSS file:
<% if @user.errors[:name] %>
<%= f.label :name, :class => "error" %>
<% else %>
<%= f.label :name %>
<% end %>
Is this what you want?
Extra: here's a section about customizing default ActiveRecord validations CSS.
Edit: (about extra ifs)
# app/helpers/application_helper.rb
def field_class(resource, field_name)
if resource.errors[field_name]
return "error".html_safe
else
return "".html_safe
end
end
And then:
# in your view
<%= f.label :name, :class => field_class(@user, :name) %>
<%= f.label :password, :class => field_class(@user, :password) %>
[...]
(I may have make a mistake in there - I'm writing on a phone - but you get the general idea. You can code this in number of ways = infinity, so do it the way you like...)
Rails now have a nice trick up its sleeve..When an error
occurs rails put a div
with a class .field_with_errors
around the error fields. So now you can just target that class and add styling.
To focus on the input you can do
.field_with_errors input{
border: 1px solid red !important;
}
this css will put a nice red line around the input
element while important!
will overwrite any existing styles.