1

使用 simple_form 我呈现一些单选按钮以在注册页面上选择 Gender。

代码:

        = f.input :gender,
              :collection => gender,
              :as => :radio_buttons,
              :item_wrapper_class => 'inline'

这给出了如下输出:

在此处输入图像描述

有没有办法让第一个单选按钮在男性后面,第二个单选按钮在女性后面?

4

3 回答 3

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]
%>
于 2012-06-06T02:11:10.647 回答
1

不确定确切的东西,但是有一种叫做 order 的东西可以分配首先显示哪个标签,例如 [:label, :input] 和内联可能在这里有所帮助。

于 2012-04-04T20:10:27.220 回答
1

您是否尝试过按您想要的顺序简单地创建或排序集合?

有人这样想:

= f.input :gender,
    :collection => gender.reverse,
    :as => :radio_buttons,
    :item_wrapper_class => 'inline'

显然,这不是更好的解决方案。您应该以正确的顺序创建列表。

于 2012-06-04T18:34:57.807 回答