仅显示属于所选商店模型Ruby的分类

时间:2013-10-02 16:57:46

标签: javascript ruby-on-rails ruby

当选择商店时,我只想查看属于所选商店的分类。有谁知道我怎么做这个?使用Ruby或Javascript

<h3>Stores Offered In</h3>
  <ul class="multi-column-checkbox">
    <% for store in Store.all %>
        <li><%= check_box_tag "idea[store_ids][]", store.id, 
@idea.stores.include?(store) %> <%= store.name %></li>
    <% end %>
  </ul>
  <br />

  <h3>Taxonomies Offered In</h3>
  <% for store in Store.all %>
     <% if store.has_taxonomies? %>
          <ul class="multi-column-checkbox">
            <h4><%= store.name %></h4>
            <% for taxonomy in store.taxonomies %>
                <li><%= check_box_tag "idea[taxonomy_ids][]", 
taxonomy.id, @idea.taxonomies.include?(taxonomy) %> <%= taxonomy.name %></li>
            <% end %>
          </ul>
     <% end %>
  <% end %>

1 个答案:

答案 0 :(得分:0)

好的 - 很多人在这里。首先,我假设您正在使用rails 3或rails 4

此外看起来这是嵌入到想法模型中,这里没有考虑到,你必须修改代码。

首先 - 尽量不要在视图中直接调用模型,除非你必须这样做,这应该在你的控制器中完成。此外,在您的视图中,请确保您有一个绑定元素用于稍后将进行的jquery调用的分类。

your_main_view_referenced_in_your_question.html.erb

<h3>Stores Offered In</h3>
<ul class="multi-column-checkbox">
  <%- @stores.each do |store| %>
    <li>
    <%= check_box_tag "store[ids]", store.id, false, :data => {:remote => true, :url => url_for( :action => 'get_taxonomies', :id => store.id ), :method => :put}, :class => 'input-large' %>
    <%= store.name %>
    </li>
  <% end %>
</ul>
<br/>
<div id="taxonomies">
</div>

接下来,您需要创建一个控制器操作来响应您的ajax调用。

stores_controller.rb

### Add an action to let you do an ajax call
def get_taxonomies
  @store = Store.find params[:id]
end

现在你需要创建一个从你的控制器动作渲染的ujs文件在我的例子中,我将控制器动作命名为get_taxonomies,所以默认情况下渲染的视图将是get_taxonimies.js.erb

get_taxonomies.js.erb

if ($(".store_" + <%= params[:id] %>).length) {
  $(".store_" + <%= params[:id ] %>).remove();
} else {
  $('#taxonomies').append("<%= escape_javascript(render(partial: '/stores/taxonomy', locals: {stores: @stores } )) %>");
}

if ($("[class^=store_]").length > 0) {
  if ( $('#taxonomies').find('h3').length ) { 
    // do nothing - leave the h3 where it is
  } else {
    $('#taxonomies').prepend("<h3>Store Taxonomies</h3>");
  }
} else {
    $('#taxonomies').find("h3").remove();
}

现在虽然您可以在js文件中编写所有html内联,但是如果你把它放在一个部分中它会变得很丑陋并且更容易编辑 - 因为js.erb文件正在调用分类法,你'我需要一个具有相同名称的部分

_taxonomy.html.erb

<div class="store_<%=@store.id%>">
  <h4><%= @store.name %></h4>
  <ul class="multi-column-checkbox">
    <%- @store.taxonomies.each do |taxonomy| %>
      <li>
      <%= check_box_tag "[taxonomy_ids][]", taxonomy.id, false %>
      <%= taxonomy.name %>
    <% end %>
    </li>
  </ul>
</div>