我正在使用sorcery进行身份验证以及twitter bootstrap。
我想通过更改添加到DOM的默认rails <div class="field_with_errors">
,以twitter的bootstrap样式在我的注册表单上设置我的错误消息。
做这样的事情的轨道惯例是什么?
我想你可以添加一些操纵DOM的javascript来重命名<div class="field_with_errors">
,但这看起来像是一个黑客。似乎应该有一种方法可以在rails中覆盖它,但我无法弄清楚在哪里这样做。
这就是bootstrap要求您标记错误以使用其内置表单错误样式的方式:
<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>
答案 0 :(得分:25)
从上面的链接中,如果您将以下内容放在class Application < Rails::Application
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
}
只要验证失败,您的输入标签就会有一个红色标记
答案 1 :(得分:2)
使用带有Bootstrap 4的Rails 6,您需要添加is-invalid
类。不必太花哨,我只是做了:
ActionView::Base.field_error_proc = proc do |html_tag, instance|
html_tag.gsub("form-control", "form-control is-invalid").html_safe
end
答案 2 :(得分:1)
对于Bootstrap 3.2,你可以使用......像这样(将nokogiri
gem添加到您的Gemfile中):
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"> #{instance.error_message.uniq.join(', ')}</span></div>).html_safe
else
html = %(<div class="control-group has-error">#{html_tag}<span class="help-block"> #{instance.error_message}</span></div>).html_safe
end
end
end
html
end
将此代码放在config/initializers/field_error_proc.rb
文件中(如果不存在则创建一个)
这是稍微修改过的代码:Overriding ActionView::Base.field_error_proc in Rails
答案 3 :(得分:1)
customize_error.rb
,适用于我:
ActionView::Base.field_error_proc = proc { |html_tag, _instance| "<div class=\"has-error\">#{html_tag}</div>".html_safe }
答案 4 :(得分:0)
请注意,如果您使用的是SimpleForm,则在application.rb中使用Proc的接受答案将无效。相反,您应该编辑simple_form初始化程序。例如,使用Bootstrap 3.2:
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
答案 5 :(得分:-1)
我只想关闭复选框的错误,所以我这样做了:
ActionView::Base.field_error_proc = Proc.new do |html_tag, instance|
doc = Nokogiri::HTML::Document.parse(html_tag)
if doc.xpath("//*[@type='checkbox']").any?
html_tag
else
"<div class=\"field_with_errors\">#{html_tag}</div>".html_safe
end
end