Rails 4：如何通過AJAX更新基於另一個collection_select的collection_select？

Question

問題： 我需要過濾一組單元的集合，其基礎是選擇一組組織。

在選擇組織，則單位下拉菜單應只刷新，顯示單位屬於知情組織。

我檢查了這些問題：

• Rails forms: updating collection_select options based on other collection_select value using AJAX

• UJS, AJAX, Rails 4, form_for collection_select to pass value into method and return value back to form

• ajax in rails with collection_select

• How to add an onchange event to select tag in rails

• Rails forms: updating collection_select options based on other collection_select value using AJAX

• Rails form_for collection_select ignoring remote ajax call that select_tag accepts

• remote select, controller needs more form data

而且這些單證：

• http://guides.rubyonrails.org/form_helpers.html
• http://api.rubyonrails.org/classes/ActionView/Helpers/FormOptionsHelper.html
• http://api.rubyonrails.org/classes/ActionView/Helpers/FormOptionsHelper.html#method-i-options_from_collection_for_select

這是到目前爲止我的代碼：

模式

class Organization < ActiveRecord::Base 
    has_many :units 
    has_many :projects, through: :units 
end 
class Unit < ActiveRecord::Base 
    belongs_to :organization 
    has_many :projects 
end 
class Project < ActiveRecord::Base 
    belongs_to :organizaton 
    has_one :organization, through: :unit 
end 

查看 應用程序/視圖/項目/ _form.html.erb

<%= form_for(@project) do |f| %> 

    <div class="field"> 
    <%= f.label :name %><br> 
    <%= f.text_field :name %> 
    </div> 
    <div class="field"> 
    <%= f.label :description %><br> 
    <%= f.text_area :description %> 
    </div> 
    <div class="field"> 
    <%= f.label :organization_id %><br> 
    <%= f.collection_select :organization_id, Organization.all, :id, :name %> 
    </div> 
    <div class="field"> 
    <%= f.label :unit_id %><br> 
    <%= f.collection_select :unit_id, Unit.all.where(organization_id: :organization_id), :id, :name %> 
    </div> 
    <div class="actions"> 
    <%= f.submit %> 
    </div> 
<% end %> 

個

控制器 項目控制器

def new 
    @project = Project.new 
end 

def project_params 
    params.require(:project).permit(:name, :description, :organization_id, :unit_id) 
end 

我怎樣才能使這項工作？

Answer 1

我做到了，該解決方案是非常簡單的，但由於缺乏這方面簡單的問題更新材料製成它更大一個苦差事比它應該有：

的config/routes.rb中

get 'filter_units_by_organization' => 'projects#filter_units_by_organization' 

控制器/ projects_controller.rb

def filter_units_by_organization 
    @filtered_units = Unit.where(organization_id: params[:selected_organization]) 
end 

層的意見/項目/ filter_units_by_organization.js.erb

$('select#project_unit_id').html('<%= j options_from_collection_for_select(@filtered_units, :id, :name) %>'); 

資產/ Java腳本/ application.js中

$(function() { 
    $("select#project_organization_id").on("change", function() { 
     $.ajax({ 
      url: "/filter_units_by_organization", 
      type: "GET", 
      data: { selected_organization: $("select#project_organization_id").val() } 
     }); 
    }); 
}); 

的意見/項目/ _form.html.erb

<div class="field"> 
    <%= f.label :name %><br> 
    <%= f.text_field :name %> 
    </div> 
    <div class="field"> 
    <%= f.label :description %><br> 
    <%= f.text_area :description %> 
    </div> 
    <div class="field"> 
    <%= f.label :organization_id %><br> 
    <%= f.collection_select :organization_id, Organization.all, :id, :name, { prompt: 'Please select' } %> 
    </div> 
    <div class="field"> 
    <%= f.label :unit_id %><br> 
    <%= f.collection_select :unit_id, Unit.all.where(organization_id: :organization_id), :id, :name %> 
    </div> 
    <div class="actions"> 
    <%= f.submit %> 
    </div> 

Answer 2

而不是在projects表上放置一個副本organization_id您應該設置關係經歷單位模型。

class Organization < ActiveRecord::Base 
    has_many :units 
    has_many :projects, through: :units 
end 

class Unit < ActiveRecord::Base 
    belongs_to :organization 
    has_many :projects 
end 

class Project < ActiveRecord::Base 
    belongs_to :unit 
    has_one :organizaton, through: :unit 
end 

這就避免了尷尬的問題，你必須以確保單位和項目有相同的organizaton_id。

這也意味着您在創建項目時不再需要輸入來選擇組織 - 只是單位。