1

simple_form を使用して、いくつかのラジオ ボタンをレンダリングして、登録ページで性別を選択します。

コード：

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

これにより、次のような出力が得られます。

ここに画像の説明を入力

最初のラジオ ボタンを男性の後ろに、2 番目のラジオ ボタンを女性の後ろに配置する方法はありますか?

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
%>

このソリューションは、通常のカスタム コンポーネントではありません。このカスタム コンポーネントは、通常の CollectionInput クラスではなく、CollectRadioButtonsInput から継承します。関連する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

正確なことはわかりませんが、[: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 に答える