如何使用 simple_form 和 bootstrap 生成无线电内联标签? [英] How to generate a radio-inline label with simple_form and bootstrap?
问题描述
我正在使用:
<%= simple_form_for @visitor, html: {class: 'form-inline'} do |f|%><%= f.error_notification %><%= f.input :favorite, label: false, as:radio_buttons %><%= f.submit "选择!", :class =>"btn btn-primary"%><%结束%>
我得到了这个 html:
但我正在寻找的是一种将标签生成为单选内联的方法,因为这是我想要的样式:
有一个类似的问题 here 但是对于radio inline"类,并且不能像生成radio-inline那样工作.
我使用的是 simple_form 3.0.2 并尝试了 3.1.0rc2 和 Bootstrap 3.2.0 with rails 4.1.4无论如何或解决这个问题的方法?
通过从这里获取灵感 answer 我设法通过创建一个 :radio_buttons_inline 输入类型来做到这一点.
创建文件:
app/inputs/radio_buttons_inline_input.rb
有这个内容:
class RadioButtonsInlineInput
然后像这样在你的视图中使用它:
<%= simple_form_for @visitor do |f|%><%= f.error_notification %><%= f.input :favorite, :as =>:radio_buttons_inline%><%结束%>
这将 html 呈现为:
<div class="control-group radio_buttons_inline requiredvisitor_favourite"><div class="控件"><label class="radio-inline"><input class="radio_buttons_inline required" id="visitor_favourite_true" name="visitor[favourite]" type="radio" value="true"/>是的标签><label class="radio-inline"><input class="radio_buttons_inline required" id="visitor_favourite_false" name="visitor[favourite]" type="radio" value="false"/>不标签>
I'm using:
<%= simple_form_for @visitor, html: {class: 'form-inline'} do |f| %>
<%= f.error_notification %>
<%= f.input :favorite, label: false, as: :radio_buttons %>
<%= f.submit "Choose!", :class => "btn btn-primary"%>
<% end %>
And I get this html:
<div class="control-group radio_buttons required visitor_favourite">
<div class="controls">
<label class="radio">
<input class="radio_buttons required" id="visitor_favourite_true" name="visitor[favourite]" type="radio" value="true" />
Yes
</label>
<label class="radio">
<input class="radio_buttons required" id="visitor_favourite_false" name="visitor[favourite]" type="radio" value="false" />
No
</label>
</div>
</div>
But what I'm looking for is a way to generate the labels as radio-inline because that is the style i want:
<label class="radio-inline">
There is a similar question here but for the "radio inline" class and desn't work as to generate radio-inline.
I'm using simple_form 3.0.2 and tried 3.1.0rc2 and Bootstrap 3.2.0 with rails 4.1.4 Anyway or method to solve this?
By getting inspiration form this answer I managed to do it by creating a :radio_buttons_inline input type.
Create the file:
app/inputs/radio_buttons_inline_input.rb
with this content:
class RadioButtonsInlineInput < SimpleForm::Inputs::CollectionRadioButtonsInput
def input
label_method, value_method = detect_collection_methods
@builder.send("collection_radio_buttons", attribute_name, collection, value_method,
label_method, input_options, input_html_options,
&collection_block_for_nested_boolean_style)
end
protected
def item_wrapper_class
"radio-inline"
end
end
And then use it in your view like so:
<%= simple_form_for @visitor do |f| %>
<%= f.error_notification %>
<%= f.input :favourite, :as => :radio_buttons_inline%>
<% end %>
This renders the html as:
<div class="control-group radio_buttons_inline required visitor_favourite">
<div class="controls">
<label class="radio-inline">
<input class="radio_buttons_inline required" id="visitor_favourite_true" name="visitor[favourite]" type="radio" value="true" />
Yes
</label>
<label class="radio-inline">
<input class="radio_buttons_inline required" id="visitor_favourite_false" name="visitor[favourite]" type="radio" value="false" />
No
</label>
</div>
</div>
这篇关于如何使用 simple_form 和 bootstrap 生成无线电内联标签?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!