simple_form Bootstrap错误验证

Question

在Rails教程第7章清单20中， https： //www.railstutorial.org/book/sign_up#sec-signup_error_messages M. Hartl使用了一个类

field_with_errors {
  @extend .has-error;
  .form-control {
    color: $state-danger-text;
  }

用引导程序设置突出显示输入错误的样式。 他在这里使用form_for助手。 我正在尝试使用simple_form做同样的事情，但是它不起作用。 有人知道如何解决吗？ 出现错误时，我想突出显示我的simple_form输入字段。 请注意，即时通讯使用f.input_filed

 <div class="input-group sign_up">
     <span class="input-group-addon"><i class="fa fa-asterisk fa-2x"></i></span>
     <%= f.input_field :password_confirmation, label: false, placeholder: "Confirm password", class: "form-control input-lg" %>   
    </div>

   <div class="input-group">
    <span class="input-group-addon"><i class="fa fa-envelope fa-2x"></i></span>
    <%= f.input_field :email, label: false, placeholder: "Email", class: "form-control input-lg" %>   
   </div>
    <div class="form-group margin-btn_top">
   <%=f.button :submit, 'Create my account', class:  "btn btn-block btn-primary btn-lg", id: "btn-signup" %>
   </div>
<% end %>

Answer 1

1. 首先看到CSS代码中的错误

   \n     field_with_errors {\n       @extend .has-error;\n       .form-control {\n         颜色：$ state-danger-text;\n       }\n

至

.field_with_errors {
  @extend .has-error;
  .form-control {
    color: $state-danger-text;
  }

2. 另外，要显示错误块，您可以执行如下所示的操作

    <% if @YOUR_VARIABLE.errors.any? %> <div id="error_explanation"> <div class="alert alert-danger"> The form contains <%= pluralize(@YOUR_VARIABLE.errors.count,"error")%>. </div> <ul> <% @YOUR_VARIABLE.errors.full_messages.each do |msg| %> <li><%= msg %></li> <% end %> </ul> </div> <% end %> 

UPDATE

With （ 对于使用f.text_field创建的字段，不使用field_with_errors包装css div，但适用于f.input ）

如果要将类传递给SimpleForm的输入，则应使用

= f.input :name, :input_html => { :class => 'input-text' }