Question

我有countries, states & cities个数据库及其模型Country, State & City。

目前的关联：

class Country < ActiveRecord::Base
  has_many :states
end

class State < ActiveRecord::Base
  belongs_to :country
  has_many :cities
end

class City < ActiveRecord::Base
  belongs_to :state
end

目前我使用这个jQuery只显示基于所选国家/地区的状态，但它仍会加载select [options]中的所有状态，这会降低页面加载速度。

- jQuery ->
  states = $('#q_state_id_eq').html()
  update_states = ->
    country = $('#q_country_id_eq :selected').text()
    options = $(states).filter("optgroup[label=#{country}]").html()

    if options
      $('#q_state_id_eq').html(options)
      # Add in a blank option at the top
      $('#q_state_id_eq').prepend("<option value=''></option>")
      # Ensure that the blank option is selected
      $('#q_state_id_eq option:first').attr("selected", "selected");
    else
      $('#q_state_id_eq').empty()

  $('#q_country_id_eq').change ->
    update_states()

  update_states()

在我的表单中（我使用的是Simple_form_for ），如何为countries, states & cities和仅加载添加 collection_select / select 选择国家/地区时选择州，选择州时加载城市？

PS：加载的州和城市需要基于选择的国家和州。

我正在寻找什么宝石或Ajax解决方案？ （其他解决方案也表示赞赏）

Answer 1

你可以在rails中使用而不使用任何gem。

f.collection_select(:state_id, State.all, :id, :name, {},{:data => {  :remote => true,
                :url => url_for(:controller => "states", 
                                :action => "display_cities")
            }
    }
)

在display_cities操作中，根据传递的state_id过滤城市。使用display_cities.js.erb用生成的新html填充div元素。

Ruby on Rails - 选择国家和州时加载州和城市

1 个答案: