6

ラジオボタンと text_field を組み合わせて単一の値にしようとしています:

= f.radio_button :system, "bacteria"
Bacteria
= f.radio_button :system, "mammalian"
Mammalian
= f.radio_button :system, "yeast"
Yeast
= f.radio_button :system, "insect"
Insect
= f.radio_button :system, "other"
Other:
= f.text_field :system, class:"input-small"

送信すると、ラジオにチェックが入っていてもparamsに空白の値が与えられるため何も起こりません（テキストフィールドを考慮していると思います）。

text_field に別の名前を付けようとして、更新後にコントローラーの :system 値を置き換えましたが、汚い方法のように見えます...

よりクリーンなアイデアはありますか？

4

2 に答える 2

2

ここでは、radio_button と text_field を同じフィールドに直接混在させることはできません。非表示になり、ユーザーが text_field に入力すると値が更新される追加の radio_button フィールドを 1 つ定義できると思います。

= f.radio_button :system, "bacteria"
Bacteria
= f.radio_button :system, "mammalian"
Mammalian
= f.radio_button :system, "yeast"
Yeast
= f.radio_button :system, "insect"
Insect
= f.radio_button :system, "other"
Other:
= f.radio_button :system, nil, :id => :hidden_radio, :style => "display:none"
= f.text_field :free_system_input, class:"input-small", :id => :free_system_input

上記では、text_field に onchange イベントを記述し、text_field 内に値が入力されるたびに、非表示の radio_button の値を text_field_value に設定します。

:javascript
 $("free_system_input").keyup(function(){
   $("hidden_radio").val($(this).val())
 })

上記のコードは、問題に対処する方法を示すためのものであり、そのままでは機能しません.. :)

于 2012-08-03T13:17:49.000 に答える
2

Sandip の助けのおかげで、なんとか問題を解決できました!

ビューは次のとおりです。

= f.radio_button :system, "bacteria"
Bacteria
= f.radio_button :system, "mammalian"
Mammalian
= f.radio_button :system, "yeast"
Yeast
= f.radio_button :system, "insect"
Insect
%br/
= f.radio_button :system, nil, id: 'other_system_radio', 
                checked: radio_checked?('system', f.object.system) 
Other:
%input.input-small#other_system_text{ value: text_input?('system', f.object.system) }

ヘルパー関数を使用して編集フォームを管理します (値が指定されたものと異なる場合はテキスト フィールドに入力します)。

def radio_checked?(type,val)
  case type
    when 'system'
      ['bacteria', 'mammalian', 'yeast', 'insect'].include?(val) ? '' : 'checked'               
    end
  end

def text_input?(type,val)
  case type
    when 'system'
      ['bacteria', 'mammalian', 'yeast', 'insect'].include?(val) ? '' : val
  end       
end

そして、ユーザーがテキスト フィールドにフォーカスしているときに [その他] ラジオ ボタンを選択するための Javascript のビット:

@handle_other_field = ->
  $('#other_system_text').focus( -> $('#other_system_radio').attr('checked','checked'))
  $('#other_system_text').keyup( -> $('#other_system_radio').val($(this).val()))
于 2012-08-06T14:03:33.173 に答える