错误 (div class="fieldWithErrors") 解决方法？

Question

在我的项目中，我有一个注册表单。

我的 HTML 看起来像

    <form method="post" action="/users">
<div style="margin: 0pt; padding: 0pt;">
<input type="hidden" value="lDHrKRC2ENhRKcaoBR4XGfzri/MY09PjqVDvHRtC0D4=" name="authenticity_token"/>
</div>    
<p><label for="login">Login</label>
        <input type="text" size="30" name="user[login]" id="user_login"/></p>

        <p><label for="email">Email</label>
        <input type="text" size="30" name="user[email]" id="user_email"/></p>

        <p><label for="password">Password</label>
        <input type="password" size="30" name="user[password]" id="user_password"/></p>

        <p><label for="password_confirmation">Confirm Password</label>
        <input type="password" size="30" name="user[password_confirmation]" id="user_password_confirmation"/></p>

        <p><input type="submit" value="Sign up" name="commit"/></p>
      </form>

现在通过提交我的代码如下所示的空表单来生成错误：

    <form method="post" action="/users">
<div style="margin: 0pt; padding: 0pt;"><input type="hidden" value="lDHrKRC2ENhRKcaoBR4XGfzri/MY09PjqVDvHRtC0D4=" name="authenticity_token"/>
</div>    
<p><label for="login">Login</label>
        </p><div class="fieldWithErrors"><input type="text" value="hg" size="30" name="user[login]" id="user_login"/></div>

        <p><label for="email">Email</label>
        </p><div class="fieldWithErrors"><input type="text" value="gh" size="30" name="user[email]" id="user_email"/></div>

        <p><label for="password">Password</label>
        </p><div class="fieldWithErrors"><input type="password" value="gh" size="30" name="user[password]" id="user_password"/></div>

        <p><label for="password_confirmation">Confirm Password</label>
        <input type="password" value="gh" size="30" name="user[password_confirmation]" id="user_password_confirmation"/></p>

        <p><input type="submit" value="Sign up" name="commit"/></p>
      </form>

这会破坏我的布局。 有解决办法吗

<input type="text" value="gh" size="30" name="user[email]" class="fieldWithErrors" id="user_email"/>

而不是

<div class="fieldWithErrors"><input type="text" value="gh" size="30" name="user[email]" id="user_email"/></div>

?

Answer 1

创建一个新的初始化器，例如，/config/initializers/field_error.rb：

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance_tag|
  if html_tag =~ /<(input|textarea|select)[^>]+class=/
    class_attribute = html_tag =~ /class=['"]/
    html_tag.insert(class_attribute + 7, "fieldWithErrors ")
  elsif html_tag =~ /<(input|textarea|select)/
    first_whitespace = html_tag =~ /\s/
    html_tag[first_whitespace] = " class='fieldWithErrors' "
  end
  html_tag  
end

• Ryan Bates 在Railscast episode 39 中对此进行了报道

Answer 2

这是 Rails 如何显示表单错误的错误。这是 Rails 的一个古老且已知的问题：https://rails.lighthouseapp.com/projects/8994/tickets/1626-fieldwitherrors-shouldnt-use-a-div

为什么它仍未解决对我来说是个谜。我想这是您需要在 Rails 中手动覆盖的许多小事情之一。不过，一定要试试 John Topley 的解决方法。或者在您的本地 Rails 代码中修复它并将其作为补丁提交给 Rails。

Answer 3

也许您应该考虑使用 formtastic http://github.com/justinfrench/formtastic。

Answer 4

Railscast 是可行的方法，但您需要为 Rails 3.x 更新它。

将此添加到您的 environment.rb

的末尾

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance_tag|
  "<span class='field_error'>#{html_tag}</span>".html_safe
end

弹跳 Rails 应用程序，您将被设置。