【rails】observe_fieldについて

業務で実装する機能で、observe_fieldを使う機会があったので、まとめておく。

  • 具体的にしたいこと
    • １つのselectで、ある値を設定したら、別のselectのプルダウンの選択肢が特定されるようにしたい。
  • 実際のコード
    • まずは監視されるselectを作成する。
animal = [["cat", "cat"], ["dog", "dog"], ["horse", "horse"]]
<%= select(:hoge, :fuga_id, animal) %>
  • 次に変更されるselectを用意する。
# _animal.rhtml ファイル
<div id = "animal">
  <% if @animals.blank? -%>
    <% @number = [] -%>
  <% else -%>
    <% select_number = [] -%>
    <% 1.upto(@animals){ |i| select_number << i } -%>
    <% @number = select_number.collect{|i| [i, i]} -%>
  <% end -%>

  <%= select(:animal, :name, @number) %>
</div>
  • ここでobserve_fieldの登場！
<%= observe_field(:hoge_fuga_id,
                  :frequency => 0.2,
                  :update => "animal",
                  :url => {:controoler => "animal",
                           :action => "select"},
                  :with => "value") %>
    • :hoge_fuga_id …監視されるselectのidを指定する。今回の場合はselectの第一引数と第二引数を『_』で繋げたものになる。railsでのselectの仕様らしい。※これはコードのHTMLを見てみると確認できる。
    • :frequency…監視(更新)する頻度を設定している。:on => 'change'と指定すると、選択した瞬間に変更になる。
    • update…更新される場所を指定している。今回はDOM idで指定した。
    • url…呼び出されるアクションの指定。
    • with…:with => "value" とすると、controllerでparams[:value]でselectのvalueが取得できる。
  • 最後にcontrollerの作成
# animal_controller.rb
  def select
    case params[:value]
    when "cat"
      @animals = 50   #"cat"を選択したとき
    when "dog"
      @animals = 100  #"dog"を選択したとき
    when "horse"
      @animals = 200  #"horse"を選択したとき
    end  
    
   render :partial => "animal"    
  end

これで、初めのselectで"cat"を選んだとき、次のselectでは選択肢が1〜50になり、
"dog"を選択すると1〜100になり、"horse"を選択すると1〜200になる！

最後までお読み頂き、ありがとうございます。