16

我正在尝试制作一个表单，在选择某些元素后将元素添加到表单中。例如，在用户选择一个国家后，我希望有一个 ajax 调用，在其中找到与该国家相关的所有地区/州，然后将其插入到表单的选择元素中。然后，一旦用户选择了一个区域/状态，将发生相同的过程，并且另一个元素将添加到表单中以响应所选值。作为旁注，我想不引人注目地做这一切。到目前为止，我认为这是：

<%= form_tag(find_school_path, :method=>'get', :class => 'form-horizontal', :id => 'find_by_country_form') do %>

    <%= label_tag :country_selection, "Country" %>
    <%= select_tag :country_selection, options_from_collection_for_select(@countries, :id, :name), :prompt => "Country" %>

<% end %>

然后在该视图的 javascript 文件中，我在选择一个国家/地区时处理 ajax 调用：

$('#country_selection').change(function(){
  $.ajax({
    url: "find/country_selection",
    type: "GET",
    data: {'country=' + $('#country_selection option:selected').value() },
  })
});

然后，在我的控制器内部，我有上述url:路由：

def country_selection
    @country = Country.find(params[:country])
    @regions = @country.regions

    respond_to do |format|
       format.js {  }
    end
end

最后，在我的 country_selection.js.erb 文件中，我有：

$('#country_selection').after('<%= label_tag :region_selection, "State/Region" %><%= select_tag :region_selection, options_from_collection_for_select(@regions, :id, :name), :prompt => "State/Region" %>');

我还没有让这个工作。我什至不确定我这样做的方式是否正确。当我点击选择并更改选项时，页面上没有任何变化。

解决方案

我的代码基本没问题，但是 '.change' 事件没有被识别。我将其更改为 '.live('change', function() {...})' 并且效果很好。

4

1 回答 1

2

这不是我见过的最整洁的代码，但从根本上我认为它没有任何问题。

我会在那里发出一些警报，以便您可以缩小问题所在。您可以在 change 函数中添加一个以确保它被命中，您可以在 country_selection.js.erb 中添加一个以确保它被命中。这会有所帮助。

我还将更改 country_selection.js.erb 以在 div 容器中呈现您希望新选择所在的部分，这样您可以将该代码放入部分中，它会更整洁一些。您可以将参数传递给将成为所选国家/地区的部分。

于 2012-08-14T09:01:25.210 回答