Rails，在下拉列表中选择选项在第二个下拉列表中过滤值

Question

我正在尝试在我的 Rails 应用程序中创建一些页面，使用我从一些 Railscasts 中学到的点点滴滴。我的环境如下：

Rails 3.2.13

红宝石 1.9.3p448

使用选择的宝石

数据库 SQLite

当我想创建一个新的配置文件时，我会访问 localhost:3000/profiles/new。 我的个人资料有一个名为名称的文本框。接下来我有一个下拉菜单 用户可以在其中选择什么配置文件类型 - 管理员、编辑器或用户。一旦一个 选项被选中，另一个下拉列表变得可见 - 特征。用户可以 然后选择 1 个或多个特征。

对于每种配置文件类型（管理员、编辑者、用户），都有不同的特征。所以 特征模型具有字段 name 和 trait_type ，其中 trait_type 将具有值 管理员、编辑者或用户。

我在为视图编码时遇到问题，假设我应该在那里编码，但也许我 应该在控制器中，让 Traits 下拉菜单只显示 如果我选择管理员配置文件类型，则管理员特征。

有人能给我一个积极的方向吗？铭记于心 我是新手。希望我提供的信息足够多，而不是太多。

注意：我的 profiles.js.coffee 文件中的 console.log 条目是临时的，只是 所以我可以看到发生了什么。

谢谢，

HoGi

-------------------------------------------------
/app/assets/javascripts/application.js
-------------------------------------------------
    //= require jquery
    //= require jquery_ujs
    //= require chosen-jquery
    //= require_tree .
-------------------------------------------------


-------------------------------------------------
/app/assets/javascripts/profiles.js.coffee
-------------------------------------------------
jQuery ->
  $('#profile_trait_ids').chosen()

jQuery ->
  $('#profile_trait_ids').parent().hide()
  prof_types = $('#profile_prof_type').html()
  console.log(prof_types)
  $('#profile_prof_type').change ->
    prof_type = $('#profile_prof_type :selected').text()
    console.log(prof_type)
    $('#profile_trait_ids').parent().show()
-------------------------------------------------  


-------------------------------------------------
/app/assets/stylesheets/application.css
-------------------------------------------------
*= require_self
 *= require chosen
 *= require_tree .
 */
-------------------------------------------------


-------------------------------------------------
/app/models/profile.rb
-------------------------------------------------
class Profile < ActiveRecord::Base
  attr_accessible :active, :name, :prof_type, :trait_ids

  has_many :traitships
  has_many :traits, through: :traitships

  PROFILE_TYPES = ["Admin", "Editor", "User"]

end
-------------------------------------------------


-------------------------------------------------
/app/models/trait.rb
-------------------------------------------------
class Trait < ActiveRecord::Base
  attr_accessible :active, :name, :trait_type

  has_many :traitships
  has_many :profiles, through: :traitships
end
-------------------------------------------------


-------------------------------------------------
/app/models/traitship
-------------------------------------------------
class Traitship < ActiveRecord::Base
  #attr_accessible :profile_id, :traid_id

  belongs_to :profile
  belongs_to :trait
end
-------------------------------------------------


-------------------------------------------------
/app/views/_form.html.erb
-------------------------------------------------
<%= form_for(@profile) do |f| %>
  <% if @profile.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@profile.errors.count, "error") %> prohibited this profile from being saved:</h2>

      <ul>
      <% @profile.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :name %><br />
    <%= f.text_field :name %>
  </div>
  <div class="field">
    <%= f.label :prof_type, 'Profile Type' %><br />
    <%= f.select :prof_type, Profile::PROFILE_TYPES, prompt: 'Select a type' %>
  </div>
  <div class="field">
    <%= f.label :trait_ids, "Traits" %><br />
    <%= f.collection_select :trait_ids, Trait.order(:name), :id, :name, {}, { multiple: true } %>
  </div>
  <div class="field">
    <%= f.label :active %><br />
    <%= f.check_box :active %>
  </div>
  <div class="actions">
    <%= f.submit 'Update' %>
  </div>
<% end %>
-------------------------------------------------

更新的控制器： (traits_controller)

# GET /traits/:trait_type/trait_options
  # GET /traits/:trait_type/trait_options.json
  def trait_options
    @traits = Trait.order(:name).where("trait_type like ?", params[:trait_type])

    respond_to do |format|
      format.html # trait_options.html.erb
      format.json { render json: @traits }
    end
  end

Answer 1

第 1 部分

您应该向控制器 (traits_controller) 添加一个新操作，该操作将一个参数 profile_type 作为输入，并将该 profile_type 的所有 traits 作为 json/xml 返回。

第 2 部分

一旦你准备好了，你应该通过 ajax 在你的profile_type 下拉列表的on_change 事件上调用这个动作。使用收到的数据构建新的traits 下拉列表。

chosen、select2 等，一旦您的第 1 部分准备就绪，应该很容易完成。

更新

我自己从未使用过chosen。但是看看它的文档，这样的东西可能对你有用

$('#profile_type').on('change', function() {
    $("#traits").chosen().change( … );
    $("#traits").trigger("chosen:updated");
});

这个Railscast (Episode #258) 演示了如何使用json 数据填充chosen select

如果可以放弃chosen 以支持select2，我强烈建议您这样做。