options_for_selectを2つのコレクションを使用するsimple_formに変換してください

Question

これは私の最初の質問です。私の仲間のプログラマーにとってより簡単にするためのヒントです。

写真広告の順序を配置するためのフォームの

背景 、あなたが製造元とモデルを選択することができますが、すべてのモデルの完全なリストが表示されて（悪いユーザーエクスペリエンス）。すべてのモデルをリストするフォームのコードは以下のとおりです。

<div id="photo-ad-make-model-fields" class='make-model-year-selector'> 
     <%= f.input :listing_known_make, label: 'Make', 
        collection: vehicle_selection.make_choices, 
        input_html: { 
         id: 'photo-ad-order-form-listing-known-make', 
         class: 'vehicle-make form-control select2 jcf-ignore', 
         data: { 
          target: 'photo-ad-order-form-listing-known-model', 
          placeholder: 'Select a make' 
         } 
        } %> 
     <%= f.input :listing_known_model, label: 'Model', 
        collection: vehicle_selection.all_model_choices, 
        input_html: { 
         id: 'photo-ad-order-form-listing-known-model', 
         class: 'vehicle-model form-control select2 jcf-ignore', 
         data: { 
          placeholder: 'Select a model' 
         } 
        } %> 

ユーザーが作る検索したり、モデルのリストにするための部分的な使用は、それが私はそれが仕事をしたい正確にどのように動作しますが、あります。 ユーザはメイクを選択し、モデルの入力をクリックし、特定のモデルのみをリストする。コード

<fieldset class="make-model-selector"> <div class="form-group clearfix"> <%= select_tag :make, options_for_select(vehicle_selection.make_choices, vehicle_selection.make), include_blank: true, class: 'vehicle-make form-control select2 jcf-ignore', data: { target: 'model', placeholder: 'Any Make' } %> </div> <div class="form-group clearfix"> <%= select_tag :model, options_for_select(vehicle_selection.model_choices, vehicle_selection.model), include_blank: true, class: 'vehicle-model form-control select2 jcf-ignore', data: { placeholder: 'Any Model' } %> </div> </fieldset> これは、レールモデル固有のJavaスクリプトによって駆動され、各モデルビューフォルダの下のビューディレクトリにあります。 （application.jsの外で初めてjsを扱うと、これは別の会社が書いたレガシーコードです）。研究から私はこれがレール機能であると判断し、javascriptでrails構文を使用すると、application.jsファイルで失敗しますが、ビューのmodelsフォルダのパスでエラーが発生します。 （私が知らなかったことを特徴と私を修正したり、私はこのレールについてはもう知らせてください）

Location of index.js files for both make and model in app heirarchy

コードビュー内/作る/ index.js

$('#<%= @target %>') .html('<%=j options_for_select(@makes) %>') .data('placeholder', 'Select a Make');

コードビューの内部/だから、私の問題になっモデル/ index.js

$('#<%= @target %>') .html('<%=j options_for_select(@models) %>') .data('placeholder', 'Select a Model');

写真広告フォームはsimple_form_forビルダーの一部です。だから私は単純なフォームに部分的なコードを変換する必要があると知っているとローカルフォーム変数を含むデータベースに保存してフォームオブジェクトの離れている。

マイsimple_formだから

<fieldset class="make-model-selector"> 
     <div class="form-group clearfix"> 
      <%= f.input :listing_known_make, label: 'Make', 
         collection: vehicle_selection.make_choices, 
         input_html: { 
         class: 'vehicle-make form-control select2 jcf-ignore', 
         id: 'photo-ad-order-form-listing-known-make', 
         data: { 
          target: 'photo-ad-order-form-listing-known-model', 
          placeholder: 'Any Make' 
         } 
        } %> 
     </div> 

     <div class ="form-group clearfix"> 
      <%= f.input :listing_known_model, label: 'Model', 
         collection: vehicle_selection.model_choices, 
         input_html: { 
         class: 'vehicle-model form-control select2 jcf-ignore', 
         id: 'photo-ad-order-form-listing-known-model', 
         data: { 
          placeholder: 'Any Model' 
          } 
          } 
         %> 
     </div> 
</fieldset> 

形部分_form.html.erbで、この部分への私の呼び出し

<%= render partial: 'photo_ad_orders/make_select.html.erb', locals: {f: f} %> 

この_make_select.erbと呼ばれる独自の部分には、部分のバージョンを変換どのように期待していますか、あなたはメイクを選択し、モデルは予想どおりのフィルタです。データベースを保存するためにクリックし、正しいターゲット、シンボル、IDを設定します。選択した内容がデータベースに正常に保存されます。

[成功で、フォームの選択] [2]

だから今問題

は私が成功し、彼らは私がやってみたかった機能を完了思ったが、この機能のQAテスト時に、私はあることを決定しユーザーが編集ボタンをクリックすると、RENDERSは編集ページを表示します。すべてのコンテンツは、選択されたメイクを含むアクティブなレコードによって電源が供給される必要があります。しかし、モデルフィールドは空ですが、フィールドをクリックすると、makeに基づいて利用可能なモデルがありません。ユーザーは、メイクフィールドをクリックして、と異なるmake（Audi）を選択してクエリを起動し、正しいmake（Aston Martin）に戻り、モデルがリストされ（DB7など）、ユーザーは正しいモデル。

After clicking edit, this is the issue

ので

1. メイクが保持されているため、再ときに、非常に少なくとも、クリック編集
2. ユーザーが既に、利用可能なモデルを照会する必要があるときに選択したモデルを充填する必要があります - レンダリング

私は単純な形式に変換すると、私はどのようにnilのようなoptions_for_select（コレクション、コレクション）

は、だから私は必要なもの

<%= select_tag :model, options_for_select(vehicle_selection.model_choices, vehicle_selection.model), 
       include_blank: true, 
       class: 'vehicle-model form-control select2 jcf-ignore', 
       data: { 
        placeholder: 'Any Model' 
       } %> 

をsimple_formするために、これを変換する正しい方法であなたは誰私に2を使用して、このoptions_for_selectを変換する正しい方法を教えてもらえますsimple_formのコレクション

私はより多くの画像を持っていましたが、stackoverflowは評判のために2つしか使用できませんでした。

Answer 1

私は方法を変更し、モデル入力はすべての利用可能なモデルを与える、と聞かせする必要があると判断javascriptはフィルタリングを処理します。

これは私のために今働きます。

<div class ="form-group clearfix"> 
      <%= f.input :listing_known_model, label: 'Model', 
         collection: vehicle_selection.all_model_choices, 
         input_html: { 
         class: 'vehicle-model form-control select2 jcf-ignore', 
         id: 'photo-ad-order-form-listing-known-model', 
         data: { 
          placeholder: 'Any Model' 
          } 
          } 
         %> 
     </div> 

---

vehicle_selection.rb

デフmodel_choices @model_choices || = make.present？ ？ model_source.call（作る）：[] エンド

デフall_model_choices @all_model_choices || = - > {} MakeModel.models エンド

Answer 2

私はあなたが選択を行うためのPROCを渡すために持っていると思う、下記のを助けるかもしれない：

f.input :listing_known_make, 
      collection: vehicle_selection.make_choices, 
      input_html: { multiple: true }, 
      selected: -> (make) { vehicle_selection.make.any? {|x| x == make} }