javascript - 动态下拉，显示结果

Question

我有一个模型，Firms，具有以下属性:州和名称。我想做的是让用户查看选定状态下的名称列表。我能够在下拉框中获取状态，但在选择状态后很难让名称显示在下面。我查看了这里的所有选项，但找不到解决方案。我想我需要一些javascript？感谢您的帮助。下面是我的查看代码。

 <h4>Select a State</h4>
<%= select_tag :state, options_for_select(Firm.order(:state).uniq.pluck(:state)) %>

以下是我希望的结果示例:

用户选择州:宾夕法尼亚州

宾夕法尼亚州名称如下:盒子公司汽车公司。。.

Answer 1

用户选择一个状态，javascript 事件触发，进行ajax调用，结果显示在:

html

<%= select_tag :state, options_for_select(Firm.order(:state).uniq.pluck(:state)), id: "my-select" %>
<div id='names-wrapper'></div>

咖啡

  $("#my-select").change ->
   state = $(this).val()
   alert(state)
   $.ajax
     url: "/firms/get_names"
     data:
       state: state
     success: (data) ->
       $('#names-wrapper').html('')
       $.each data, (index, value) -> 
         $('#names-wrapper').append(value)

路线

resources :firms do
  collection do
    get :get_names
  end
end

Controller

class FirmsController < ApplicationControler
  def get_names
    state = params[:state]
    names = Firm.where(state: state).pluck(:name)
    return render json: names.to_json
  end
end