有没有办法申请＆＃34; field_with_errors＆＃34;类到Rails中的现有元素？

Question

我在Rails应用程序中验证表单数据，以及包含类＆＃34; field_with_errors＆＃34;的div。正在抛弃我用Flexbox设计的表格。

有没有办法让Rails附加＆＃34; field_with_errors＆＃34;现有元素上的类而不是用它创建一个新的div？

示例：

<li class="field_with_errors">
  <input .... />
</li>

而不是

<div class="field_with_errors">
  <li>
    <input .... />
  </li>
</div>

Answer 1

您应该重写ActionView :: Base.field_error_proc。它在ActionView :: Base中定义：

Sorry for such a long post....

您可以将其更改为更适合您的用户界面：

@@field_error_proc = Proc.new{ |html_tag, instance| 
  "<div class=\"field_with_errors\">#{html_tag}</div>".html_safe
}

重启你的服务器，你应该好好去。

Answer 2

我找到了解决此问题的方法（在hashrocket的帮助下！）。

初始代码：

<li>
 <span>Email</span>
 <%= f.text_field :email%>
</li>

我添加了这个配置：

config.action_view.field_error_proc = Proc.new 
 { |html_tag, instance| "#{html_tag}".html_safe }

当我现在提交包含无效电子邮件输入的表单时：

<li>
 <span>Email</span>
 <span id="input_tag"></span>  // added by Rails
 <%= f.text_field :email%>
</li>

然后在css中，我将新元素的显示设置为none，但使用它来定位以下输入字段：

form ul li span#input_tag {
 display: none;
}

form ul li span#input_tag + input {
 border: 2px solid red;
}

不是最优雅的解决方案，但它适用于我的目的。

欢迎任何更时尚的解决方案！