Question

我有一个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>

同样，我感谢任何反馈！

Answer 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>

一切正常，就像我希望的那样！

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

1 个答案: