デフォルトのレールエラーdivを変更する方法 "field_with_errors"

Question

twitter bootstrapと一緒に認証にsorceryを使用しています。

DOMに追加されるデフォルトのレール<div class="field_with_errors">を変更することで、自分のサインアップフォームのスタイルをtwitterのブートストラップでスタイルしたいと思います。

このようなことをするためのレールコンベンションは何ですか？

DOMを操作して<div class="field_with_errors">の名前を変更するjavascriptを追加することもできますが、これはハックのようです。これをレールでオーバーライドする方法があるはずですが、どこでそれを行うべきかわかりません。

これは、ブートストラップは、その形状誤差のスタイルで構築されたを使用するようにエラーをマークアップする必要がどのようである：

<div class="control-group error"> 
    <label class="control-label" for="inputError">Input with error</label> 
    <div class="controls"> 
    <input type="text" id="inputError"> 
    <span class="help-inline">Please correct the error</span> 
    </div> 
</div> 

Answer 1

上のリンクから、あなたはconfig/application.rb

config.action_view.field_error_proc = Proc.new { |html_tag, instance| 
    "<div class=\"field_with_errors control-group error\">#{html_tag}</div>".html_safe 
} 

の class Application < Rails::Application内の以下を置く場合

妥当性検査が失敗した場合、入力タグの周囲に赤いマーカーが表示されます

Answer 2

ブートストラップ3.2ではsthを使用できます。もしことOverriding ActionView::Base.field_error_proc in Rails

Answer 3

注：これは、少しのコードを変更しているconfig/initializers/field_error_proc.rbファイル内

ActionView::Base.field_error_proc = Proc.new do |html_tag, instance| 
    html = %(<div class="field_with_errors">#{html_tag}</div>).html_safe 
    # add nokogiri gem to Gemfile 

    form_fields = [ 
    'textarea', 
    'input', 
    'select' 
    ] 

    elements = Nokogiri::HTML::DocumentFragment.parse(html_tag).css "label, " + form_fields.join(', ') 

    elements.each do |e| 
    if e.node_name.eql? 'label' 
     html = %(<div class="control-group has-error">#{e}</div>).html_safe 
    elsif form_fields.include? e.node_name 
     if instance.error_message.kind_of?(Array) 
     html = %(<div class="control-group has-error">#{html_tag}<span class="help-block">&nbsp;#{instance.error_message.uniq.join(', ')}</span></div>).html_safe 
     else 
     html = %(<div class="control-group has-error">#{html_tag}<span class="help-block">&nbsp;#{instance.error_message}</span></div>).html_safe 
     end 
    end 
    end 
    html 
end 

置き、このコードは（存在しない場合は1を作成する）

：この（あなたのGemfileにnokogiri宝石を追加）などのあなたはSimpleFormを使用していますが、application.rbでProcを使用するという答えはうまくいかないでしょう。代わりに、simple_form初期化子を編集する必要があります。 3.2ブートストラップ使用例：Railsの5の

config.wrappers :default, class: :input, 
    hint_class: :field_with_hint, error_class: :'has-error' do |b| 
    [...] 
    b.use :hint, wrap_with: { tag: :span, class: :'text-warning' } 
    b.use :error, wrap_with: { tag: :span, class: :'text-danger' } 
end 

Answer 4

Twitterのブートストラップ3.3.6を、これは初期化子customize_error.rbに行くと私の作品：

ActionView::Base.field_error_proc = proc { |html_tag, _instance| "<div class=\"has-error\">#{html_tag}</div>".html_safe }