Ruby on rails 自定义带有错误的字段\u

有没有办法告诉Rails不要在标签和实际字段周围创建带有错误的

div.field\u，而是在它们周围创建
div.error

例如，表单中的“我的观点”片段（用HAML编写）

在出现错误的情况下，我希望根div为
div.clearfix.error
，并避免该
字段出现错误。我可以这样做吗

作为另一种选择，我可以让formtastic创建样式化的元素，不使用formtastic的css和html类，而是使用bootstrap的类。在使用formtastic的情况下，我可以用错误字段做些什么吗？
它实际上比你想象的更令人恼火

我最终创建了自己的标记帮助程序（我还需要用于其他目的），尽管我一开始只是覆盖
ActionView:：Base.field\u error\u proc
。（这本身就是一个故事，因为它是以一根弦传递的，实际上不是你可以可靠地摆弄的东西：(

但是从这一点开始，看看它对您是否足够，否则就准备一些挖掘和调整。
您可以使用gem使用Formtastic创建Twitter引导友好的标记。
如果您将SASS与Twitter引导一起使用，您可以使用@extend指令将Twitter引导样式应用于Rails生成的CSS claSSE。（搜索GitHub，有几个引导/SASS端口可用。）

例如：

@import "bootstrap";

/* Rails scaffold style compatibility */
.errorExplanation {
  @extend .alert-message;
  @extend .block-message;
  @extend .error;
}

.fieldWithErrors {
  // pulled from div.clearfix.error
  @include formFieldState(#b94a48, #ee5f5b, lighten(#ee5f5b, 30%));
}

请注意，“error”的Twitter引导样式附加到div.clearfix选择器，这使我们无法简单地执行此操作：

.fieldWithErrors {
  @extend .error;
}

因此，我将引导的div.clearfix.error定义中的代码复制/粘贴到我的.fieldWithErrors选择器中。
@flowderic的答案似乎是最简单的修复方法。但是，名称不正确。
这可能是由于Rails/Bootstrap版本的缘故，但这对我来说是可行的

/* Rails scaffold style compatibility */
#error_explanation {
  @extend .alert;
  @extend .alert-error;
  @extend .alert-block; /* optional */
}

.field_with_errors {
  @extend .control-group.error
}

下面是我想到的

我把这个添加到我的css中

.field_with_errors {
    display:inline;
    margin:0px;
    padding:0px;
}

我将此添加到

如果任何人使用较少：

在bootstrap_和_overrides.css.less中，您可以添加：

#error_explanation {
  .alert();
  .alert-error();
  .alert-block();
}

.field_with_errors {
  .control-group.error();
}

这是所示sass示例的较低版本。
有一个非常简单的解决方案来解决所有这些问题。它基于javascript，但解决了我的问题-只需添加以下内容（使用水平形式时）：

它基本上采用默认的Rails行为，并将其转换为Bootstrap行为。
没有
css
，也没有覆盖默认的
字段\u error\u proc
，我没有足够的要点来评论，因此我将在这里回答：

通过@iosctr添加到答案中——css只有在我添加到我的
bootstrap\u和_overrides.css.scss
文件后才开始工作：

@import "bootstrap";
body { padding-top: 40px; }
@import "bootstrap-responsive";

#error_explanation {
  @extend .alert;
  @extend .alert-error;
  @extend .alert-block; 
}

.field_with_errors {
  @extend .control-group.error;
} 

这就是使用gem时bootstrap3的工作原理

在bootstrap 3.0中，类是
有错误
。@oded的解决方案应该是：

$('.field_with_errors').parent().addClass('has-error');

下面是我对bootstrap 3.0.3和rails 4.0.2所做的：

/* Rails scaffold style compatibility */
#error_explanation {
  @extend .alert;
  @extend .alert-danger;
  width: inherit;
}

.field_with_errors {
  @extend .has-error;
  display: inherit;
  padding: inherit;
  background-color: inherit;
}

引导程序3和Rails 4--我必须执行以下操作：

.alert-error{
    color: #f00;
    @extend .alert;
    @extend .alert-danger;
}

#error_explanation
{   ul
    {
        list-style: none;
        margin: 0 0 18px 0;
        color: red
    }
}

.field_with_errors
{
    input {
    border: 2px solid red;
    }
}

创建带有错误的
config/initializers/field\u.rb
with:

ActionView:：Base.field_error_proc=proc.new do | html_标记，实例|
“#{html_tag}”.html_安全
结束

这将把有错误的
.field
交换为
.error

然而，我发现“Rails方式”的最大问题是，它用一个新的
div
来包装元素，而不是简单地将类添加到元素本身。我更喜欢这样：

ActionView:：Base.field_error_proc=proc.new do | html_标记，实例|
parts=html_tag.split（'>'，2）
零件[0]+=“class=”字段中有错误“>”
（部分[0]+部分[1]）.html\u安全
结束
是的，您可以破解包装器div。借用我的修改，将包装器转换为标签上的
无效的
类，并形成输入本身

将其放在配置中的某个位置（例如
environments.rb
）

如果在较新的引导版本中使用SASS:
.field\u和\u errors{@extend.has error；}
，这将是：
.has-error（）
而不是
.control group.error（）
.new one
@extend.alert danger；
这应该是公认的答案。遗憾的是，html_标记是一个ActiveSupport:：SafeBuffer，基本上是一个字符串变量，这使得包装很容易，但修改起来非常困难！这就是方法。不过，为了维护当前的类，我改用它：
html_标记.gsub（/class=“（.*）/”，class=“\1无效”）
.field_with_errors {
  @include form-control-validation($state-danger-text, $state-danger-text, $state-danger-bg);
}

$('.field_with_errors').parent().addClass('has-error');

/* Rails scaffold style compatibility */
#error_explanation {
  @extend .alert;
  @extend .alert-danger;
  width: inherit;
}

.field_with_errors {
  @extend .has-error;
  display: inherit;
  padding: inherit;
  background-color: inherit;
}

.alert-error{
    color: #f00;
    @extend .alert;
    @extend .alert-danger;
}

#error_explanation
{   ul
    {
        list-style: none;
        margin: 0 0 18px 0;
        color: red
    }
}

.field_with_errors
{
    input {
    border: 2px solid red;
    }
}

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance|
  (html_tag.gsub /class="(.*?)"/, 'class="\1 invalid"').html_safe
end