[英]how do I align my error message with Simple_form for Ruby on Rails?
at present, my form looks like this with an error message (Name is a required field): 目前,我的表单看起来像这样,并显示一条错误消息(“名称”为必填字段):
But I want to put the 'can't be blank' error alongside the 'Name', like this: 但是我想将“不能为空”错误与“名称”放在一起,如下所示:
I've given myself more freedom on the 'Name' label and error by changing from default bootstrap Simple_form classes with this code: 通过使用以下代码从默认的引导程序Simple_form类进行更改,我为自己在“名称”标签和错误上提供了更多的自由:
<%= f.input :name, :required => true, :label_html => { :class => 'edit_form_titles' }, :error_html => { :class => 'cant_be_blank'} %>
And my css for these classes is: 对于这些类,我的css是:
.edit_form_titles{
display: block;
margin-bottom: 0px;
color: #333333;
}
.cant_be_blank{
font-size:12px;
}
Any idea on how I can align the error message next to the name, as I describe? 如我所描述的,关于如何在错误名称旁边对齐错误消息的任何想法? Thanks for any help. 谢谢你的帮助。
I managed to get my errors displaying in the label above the input box. 我设法使错误显示在输入框上方的标签中。
With the code below I've given my errors a class, which can be formatted as to positioning etc, but there was always a blank div or something under the input box, which put the other input boxes under it out of joint. 在下面的代码中,我给我的错误一个类,可以将其格式化为位置等,但是在输入框下始终有一个空白div或其他内容,这使其他输入框脱离了关节。
<%= f.input :name, :required => true, :label_html => { :class => 'edit_form_titles' }, :error_html => { :class => 'cant_be_blank'} %>
In my initializers/simple_form.rb there was: 在我的初始值设定项/simple_form.rb中,有:
config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
b.use :html5
b.use :placeholder
b.use :label
b.wrapper :tag => 'div', :class => 'controls' do |input|
input.use :input
input.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
input.use :hint, :wrap_with => { :tag => 'p', :class => 'help-block' }
end
end
I changed this to: 我将其更改为:
config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
b.use :html5
b.use :placeholder
b.wrapper :tag => 'div', :class => 'label-error' do |input|
b.use :label
b.use :error, :wrap_with => { :tag => 'span', :class => 'help-block' }
end
b.wrapper :tag => 'div', :class => 'controls' do |ba|
ba.use :input
ba.use :hint, :wrap_with => { :tag => 'p', :class => 'help-block' }
end
end
That got rid of the blank empty space under the input box and I could format my cant_be_blank class so the text appears exactly next to the text in my label. 这消除了输入框下的空白空间,我可以设置cant_be_blank类的格式,以便文本恰好出现在标签中文本的旁边。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.