使用simple_form我渲染一些单选按钮,在注册页面上选择Gender。
代码:
= f.input :gender,
:collection => gender,
:as => :radio_buttons,
:item_wrapper_class => 'inline'
这给出了输出:
有没有办法让第一个单选按钮位于男性背后?第二个单选按钮位于女性背后?
答案 0 :(得分:4)
这是一个比我原来的更好的解决方案。
来自代码:
# form_for @user do |f|
# f.collection_radio_buttons(
# :options, [[true, 'Yes'] ,[false, 'No']], :first, :last
# ) do |b|
# b.label { b.radio_button + b.text }
# end
# end
我认为这就是你要找的东西:
<%= f.collection_radio_buttons(
:gender, [['Male', 'Male'], ['Male', 'Male']], :first, :last
) do |b|
b.label { b.text + b.radio_button }
end
%>
您甚至可以在其中添加其他帮助程序,例如image_tag
:
<%= f.collection_radio_buttons(
:gender, [['Male', 'Male'], ['Male', 'Male']], :first, :last
) do |b|
b.label { image_tag("#{b.text}.png") + b.radio_button }
end
%>
此解决方案不是普通的自定义组件。此自定义组件继承自CollectRadioButtonsInput而不是普通的CollectionInput类。我修改了2个相关方法。
内部app/inputs/radio_buttons_left_label_input.rb
class RadioButtonsLeftLabelInput < 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 build_nested_boolean_style_item_tag(collection_builder)
collection_builder.text.html_safe + collection_builder.radio_button.html_safe
end
end
可以像这样使用
<%= form.input :gender,
:as => :radio_buttons_left_label,
:collection => %w[Female Male]
%>
答案 1 :(得分:1)
不确定确切的事情,但有一些称为订单的东西,可以分配哪个标签首先显示,例如[:label,:input]以及内联可能对此有所帮助。
答案 2 :(得分:1)
您是否尝试按照您想要的顺序创建或排序集合?
有些想法:
= f.input :gender,
:collection => gender.reverse,
:as => :radio_buttons,
:item_wrapper_class => 'inline'
显然,这不是更好的解决方案。您应该按正确的顺序创建列表。