Rails: 简单表单 + bootstrap - 当出现错误时，字段未变红

Question

我已开始使用 Simple-form 和 Bootstrap，并尝试遵循此参考：Simple form + Bootstrap，但我不知道发生了什么，因为当一个字段失败时，会出现以下情况：

关于此截图，我有一个问题：
1）如您所见，价格字段没有被红色包围。我该怎么做？ 这是我的表单代码：

<%= simple_form_for @lesson, :html => { :class => 'well' } do |lesson_form| %>
<% if lesson_form.error_notification %>
    <div class="alert alert-error fade in">
      <a class="close" data-dismiss="alert" href="#">&times;</a>
      <%= lesson_form.error_notification %>
    </div>
<% end %>
  <%= lesson_form.input :title %>
  <%= lesson_form.input :category %>
  <%= lesson_form.input :description %>
  <%= lesson_form.input :price %>
  <%= lesson_form.button :submit, :label => 'Create', :class => 'btn btn-primary btn-large' %>
<% end -%>

- Hommer Smith

Answer 1

我相信你参考的代码在错误通知方面有些误导和不正确。

更改为：

<% if lesson_form.error_notification %>
    <div class="alert alert-error fade in">
      <a class="close" data-dismiss="alert" href="#">&times;</a>
      <%= lesson_form.error_notification %>
    </div>
<% end %>

简单来说：

<%= lesson_form.error_notification %>

接下来，在config/locals/simple_form.en.yml文件中，将default_message修改为：

default_message: '<a class="close" data-dismiss="alert">&times;</a>Some errors were found, please take a look:'

这将修复错误警报框中的不对称问题（通过修复产生的标记）。

为了排除验证错误未以红色显示的问题，您需要共享标记，以便我们了解情况。

- George Anderson

Answer 2

看一下价格字段旁边的文本。Simple for会将错误放在该字段旁边。

为了清理您的表单，请尝试以下操作：

删除此内容，因为它在使用simple-form gem时不需要：

<% if lesson_form.error_notification %>
    <div class="alert alert-error fade in">
      <a class="close" data-dismiss="alert" href="#">&times;</a>
      <%= lesson_form.error_notification %>
    </div>
<% end %>

将您的:html => { :class => 'well' }更改为:html => { :class => 'well form-horizontal' }

这将更好地布局您的表单，并将Bootstrap CSS应用于错误字段和文本。

- Eric Sites

---

我想删除你要求我删除的那部分，因为我想在顶部显示红色框（见图像）。如果我删除它，任何错误都不会显示。感谢您提供了清理表单的建议，但我想知道为什么我看不到红色的错误提示（靠近字段）。 - Hommer Smith