让Carmen-Rails子区域选择正常工作

时间:2014-09-09 19:59:10

标签: javascript jquery ruby-on-rails coffeescript

我一直在努力让Carmen-rails演示在我的应用程序中工作无济于事。我知道coffeescript正在工作,因为我可以通过使用document.ready来完成工作。从这个角度来看,问题在于,当国家改变时,国家根本不会更新。这就是我所拥有的。

在我使用simple_form的表单中:

%h3 Country
= f.input :country, priority: %w(US CA IL), input_html: {id: "country_select"}, prompt: 'Please select a country'
= render partial: 'subregion_select', locals: {parent_region: f.object.country}

_subregion_select partial:

#customer_state_code_wrapper
  - parent_region ||= params[:parent_region]
  - logger.info("Parent region is #{parent_region}")
  - country = Carmen::Country.coded(parent_region) unless parent_region.nil?
  - if country.nil?
    %em Please select a country above
  - elsif country.subregions?
    = subregion_select(:customer, :state, parent_region)
  - else
    = text_field(:customer, :state)

customer.js.coffee

$ ->
  $('select#country_select').change (event) ->
    alert "Blah"
    select_wrapper = $('#customer_state_code_wrapper')
    $('select', select_wrapper).attr('readonly', true)
    country_code = $(this).val()
    url = "/customers/subregion_options?parent_region=#{country_code}"
    select_wrapper.load(url)

当我点击国家/地区选择框并更改值时,即使触发警报也没有任何反应。我有选择框的正确ID,因为它显示为:

<select class="country optional" id="country_select" name="customer[offices_attributes]

我在控制台中看不到java的错误,我无法弄清楚我做错了什么。任何帮助将不胜感激!

为了更好地格式化,当我在控制台中查看已编译的JS文件时,它显示以下内容:

(function() {
  $(function() {
    return $('select#country_select').change(function(event) {
      var country_code, select_wrapper, url;
      alert("Blah");
      select_wrapper = $('#customer_state_code_wrapper');
      $('select', select_wrapper).attr('readonly', true);
      country_code = $(this).val();
      url = "/customers/subregion_options?parent_region=" + country_code;
      return select_wrapper.load(url);
    });
  });
}).call(this);

进一步观察之后我认为问题可能是这个表单是通过simple_nested_form通过以下方式加载的部分呈现的:

= f.fields_for :offices do |o| = render :partial => 'offices', :locals => {:o => o} = f.link_to_add image_tag("layout_add.png") + " Add Another Office", :offices

所以我认为当加载javascript时,它没有任何附加内容。当我单击加载表单的link_to_add然后运行:

$('select#country_select').change ->
  alert "blah"

通过控制台,它可以正常工作。那么如何在有人点击显示表单的link_to_add后加载脚本?

1 个答案:

答案 0 :(得分:0)

杰德的最后一条评论让我把问题搞清楚了。我修改了js.coffee,以便在选择框上观察更改,从而正确地触发事件。