2

I would like to apply a style to successfully validated fields as well as failed fields.

I am using the fields_with_errors div which is applied around form elements which fail validation. I would like to extend this behaviour to apply fields_without_errors styled div around successfully validated fields.

For example when rails validation fields, the rendered view returns as follows:

<div class="field_with_errors"><input class="input" size="30" type="text" value="" name="seller_profile[business_phone_number]" id="seller_profile_business_phone_number"></div>

The original erb code was:

<div class="row">
        <label for="telephone">Company telephone</label>
        <br />
       <%=f.text_field :business_phone_number, :class=>"input", size:"30" %>
        <div class="errors">
        <%if @profile.errors[:business_phone_number].any? %>
        Phone number <%= @profile.errors[:business_phone_number].join(", ")%>
        <% end %>
        </div>
        <br />
      </div>

This works very well. However for fields which have passed validation, they do not get wrapped in a div stating validation has passed.

I would like fields which pass validation to look as follows:

 <div class="field_without_errors"><input class="input" size="30" type="text" value="" name="seller_profile[business_description]" id="seller_profile_business_description"></div>

I.e they are wrapped in a div with a class of "field_without_errors".Is there a way for me to add this behaviour in rails?

RenegadeAndy
  • 5,440
  • 18
  • 70
  • 130
  • Possible duplicate of http://stackoverflow.com/questions/12252286/how-to-change-the-default-rails-error-div-field-with-errors – Max Williams Feb 10 '16 at 11:29
  • Define simple. You will have to find a way how to distinguish successfully validated fields from fields that haven't validated yet. And you will probably have to override the the form builder class to handle successfully validated fields differently. – spickermann Feb 10 '16 at 11:29
  • You might be able to do this just with css. Please add, to your question, an example of the rendered-out html for a form which has a mix of valid and not valid inputs. If there is a div around the form which rails has added, with an error class or something, make sure you include that. – Max Williams Feb 10 '16 at 11:31
  • Updating question.... – RenegadeAndy Feb 10 '16 at 11:41

1 Answers1

-1

I would just do this with css: make sure that if you render out a form for an object which has had it's validation tested, you add a class to the form, like "validated" for example. Rails might do this already.

Then you can add style rules for fields within a form within this class which have failed validation (ie have the error class which is added by rails) (or just stick with rails' own default rules), and overide these rules for inputs without the error class: these rules will be applied to the inputs which have NOT failed.

Max Williams
  • 32,435
  • 31
  • 130
  • 197
  • The point here is Max, that rails does not tag correctly validated fields. Of course CSS is the answer from a styling perspective - but that's not the question. The question is how to make rails add a tag with a class around fields which pass validation. – RenegadeAndy Feb 10 '16 at 11:40
  • No, the question asks how to "apply a style", and the title just says "Highlight". Applying a style to an element doesn't necessarily require that element to have a specific class, since rules override one another. If you want the question to be about how to add a class, then change the question to ask how to do that, rather than how to style the element. They are not the same thing. – Max Williams Feb 10 '16 at 13:16