Rails 3.2 アプリには、動的選択フィールドのペアがあります。この典型的な例は、変更時に州の選択のオプションをフィルタリングする国の選択です。これは完全に機能しています。
しかし、ユーザーが新しい状態をリストに追加できるようにする必要がある場合はどうすればよいでしょうか?
これはかなり一般的なケースのようですが、最善のアプローチに関する多くの情報を見つけることができませんでした。私が見つけたものはselect
タグに関連しており、grouped_collection_select
私が使用しているタグはより挑戦的です.
他の人の意見や同様のことを実装した経験を知りたいです。非常に基本的なレベルで、これにどのように取り組みますか?
たとえば、コントローラーまたは JavaScript を使用して、選択に [新規追加] オプションを含めることができます (注: 以下は、有効なコードではなく概念を示しています)。
@state_options = State.all.collect {|so| [ so.country.id, so.id, so.name ] }
@state_options << [nil, nil, "Add New"]
次に、「新規追加」が選択されているかどうかを検出します。
- 保存時に、ユーザーが州名、親国、およびその他の詳細を入力するためのポップアップが表示されます。
- または変更時に、いくつかの追加フィールドが JavaScript で表示されます (UX は向上しますが、JavaScript が存在しない場合はフォールバックが必要です)。
または、次のような「新規追加」リンクを含めることもできます。
- 保存時に状態選択フィールドで Ajax 更新を行う新しい状態フォームを含むポップアップを表示します。
- 親フォームが保存されるときに新しい State に組み込まれるいくつかのテキスト フィールドで State 選択を置き換えます。
では、どちらのアプローチが優れているのか、その理由を知りたいのですが?
また、いくつかのコード化された例にも感謝します。上記のマージされた配列を試してみましたが@state_options
、構文に苦労しています - syntax error, unexpected '['
、および私のjavascriptスキルはあまり進んでいません。
私のコードは現在次のようになっています。
<%= simple_form_for(@address ) do |f| %>
<%= f.collection_select :country_id, Country.order(:name), :id, :name, include_blank: true %>
<%= f.grouped_collection_select :region_id, Country.order(:name), :regions, :name, :id, :name, include_blank: true %>
<% end %>
(上記のグループ化された選択で :regions を @state_options に置き換えます。そのルートに行く場合。)
コーヒースクリプトは次のようになります
jQuery ->
states = $('#address_state_id').html()
console.log(states)
$('#address_country_id').change ->
country = $('#address_country_id :selected').text()
escaped_country = country.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1')
options = $(states).filter("optgroup[label=#{escaped_country}]").html()
console.log(options)
if options
$('#address_state_id').html(options)
else
$('#address_state_id').empty()