Rails 4：如何通过AJAX更新基于另一个collection_select的collection_select？

Question

问题： 我需要根据组织集合的选择过滤单位的集合。

选择组织后，单元下拉菜单应刷新以仅显示属于通知组织<的单位 / strong>即可。

我已经检查了这些问题：

• 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

我做到了，解决方案很简单，但缺乏关于这个简单问题的更新材料使它变得比它应该具有的更大的苦差事：

配置/ 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) %>');

资产/ Javascript角/ 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

不应在Negative = -2, -7, -1表格上放置重复的organization_id，而应将关系设置为通过单位模型。

projects

这避免了您必须确保单元和项目具有相同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 的尴尬问题。

这也意味着您在创建项目时不再需要输入来选择组织 - 只需要单位。