javascript - jQuery を使用して複数のオブジェクトを更新する

Question

パーシャルを使用してすべてのユーザーのリストをレンダリングするプロファイル ページがあります。

ユーザー/show.html.erb

<%= render @lists %>

リストごとに、関連付けられている願いの数を示します。

リスト/_list.html.erb

<p class="muted" id="wishes_count"><%= pluralize(list.wishes.count, "wish") %></p>

私はドラッグ アンド ドロップを使用して、ユーザーが jQuery ソート可能を使用して、あるリストから別のリストにウィッシュを移動できるようにしています。

現在、次のコードを使用しています。

Wishes.js.erb

$(document).ready(function(){
  $('.user_list_wishes').sortable({
   connectWith: ".user_list_wishes",
   items: ".user_list_wish",
   placeholder: "sortable_placeholder",
   update: function(e, ui)
   {
      if (this === ui.item.parent()[0]) 
      {
        item_id = ui.item.data('item-id');
        list_id = $(this).data('list-id');
        position = ui.item.index();
        $.ajax({
          type: 'POST',
          url: $(this).data('update-url'),
          dataType: 'json',
          data: { id: item_id, wish: { row_order_position: position, list_id: list_id } }
        }),
        $("#wishes_count").html('<%= pluralize(list.wishes.count, "wish") %>')
      }
    }
  })
})

このコード行:

$("#wishes_count").html('<%= pluralize(list.wishes.count, "wish") %>') 

私のアプリケーションはNoMethodError undefined method 'wishes' for nil:NilClass

リストをレンダリングし、JavaScriptで個別に参照する方法と関係があると思いますか?

この問題を解決する方法についての提案は大歓迎です!