如何设置 Rails 3 jQuery 视图以显示州列表，然后列出属于该州的城市？答案

【问题标题】：How do I setup a Rails 3 jQuery view to show a list of states, then list cities belonging to that state?如何设置 Rails 3 jQuery 视图以显示州列表，然后列出属于该州的城市？
【发布时间】：2012-04-23 06:43:58
【问题描述】：

我有一个State 模型has_many :cities 和一个city 模型belongs_to :state。我想显示一个州列表，然后当用户点击一个州时，进行 ajax 调用以在下面显示属于该州的城市。

我确信这可以使用 jQuery 完成，并且没有部分，我只是在想出一些示例和解决方案时遇到了麻烦。

这是我希望它首先看起来的样子： - 阿拉巴马州 - 阿拉斯加 - 阿肯色州 - 等等。

如果有人点击“阿拉斯加”，列表将更新为： - 阿拉巴马州 - 阿拉斯加 - 安克雷奇 - 费尔班克斯 - 朱诺 - 阿肯色州

任何帮助将不胜感激！

编辑

好的，所以我一直在驱逐 jQuery 我想出了以下代码。我不能让各州单独展示他们各自的城市。照原样，如果您单击任何一个州，它只会显示第一个州的城市。

代码如下：

<script>
$(function(){
    $('#city').hide();
$('.toggle').toggle(function(){
    $('#city').fadeIn(100);
},
function(){
    $('#city').fadeOut(100);
});
});

</script>
<%= render "layouts/header"%>

<table class="state_list">
<% @states.in_groups_of(1, false).each do |state| %>
  <tr>
<% for state in state %>
<td>    
<div class="toggle"><h3><%= state.name %><br /></h3></div>
    <% @cities.each do |city| %>
        <% if city.state.id == state.id %>
                    <div id="city"><%= link_to city.name, cities_path(:city_id => city.id) %> (<%= city.posts.where(:published => true).count %>)<br />
            <% end %>
        <% end %>   
</div>
    </td>
        <% end %>
  </tr>
<% end %>
</table>

再次感谢任何反馈！

【问题讨论】：

向我们展示您到目前为止所获得的 - 要求人们为您编写代码不会得到太多帮助。 :)
感谢您的反馈...我什至不知道从哪里开始。我正在探索使用 jQuery 切换与迭代数据相结合......我想我现在接近有一个特定于代码的问题。我只是在寻找一些关于在哪里寻找的指示......

标签： jquery ruby-on-rails ruby-on-rails-3

【解决方案1】：

StackOverflow 答案

我明白了！

这是我做的参考...另外，如果您看到更好的方法，请告诉我。

<table class="state_list">
<% @states.in_groups_of(1, false).each do |state| %>
<tr>
<% for state in state %>
<td>    
    <script>
    $(function(){
            $('#city-<%=state.id%>').hide();
        $('#toggle-<%=state.id%>').toggle(function(){
            $('#city-<%=state.id%>').fadeIn(100);
        },
        function(){
            $('#city-<%=state.id%>').fadeOut(100);
        });
    });

    </script>
<div id="toggle-<%=state.id%>"><h3><%= state.name %><br /></h3></div>
    <% @cities.each do |city| %>
        <% if city.state.id == state.id %>
                    <div id="city-<%=state.id%>"><%= link_to city.name, cities_path(:city_id => city.id) %> (<%= city.posts.where(:published => true).count %>)<br />
            <% end %>
        <% end %>   
</div>
</td>
    <% end %>
  </tr>
<% end %>
</table>

一切都如我所愿！

【讨论】：