Jquery Sortable Objects Ajaxリクエストが間違ったオブジェクトを送信しています

Question

JQuery Sortableを正常に実装しました。別の呼び出しを使用してデータベースに書き込むこともできます。ただし、これは、影響を受ける最初の一致するクラスのセットに対してのみ機能します。 2番目は、その後に何かがあった場合、私は動作しません。

<ul class="grouped-articles-list"> 
     <li id="4weight10"></li> 
     <li id="3weight20"></li> 
     <li id="2weight30"></li> 
</ul> 

<ul class="grouped-articles-list> 
     <li id="5weight50"></li> 
     <li id="6weight60"></li>  
     <li id="22weight70"></li> 
     <li id="18weight80"></li>  
</ul> 

私はすべて共通のクラスを共有する複数のULを持っています。ビジュアル面は完全にソート可能な状態で正しく動作します。 Array = $（ "。grouped-articles-list"）。sortable（ 'toArray'）、次にajax関数を呼び出します。 trace/console.logを実行すると、前のクラスのオブジェクトだけが返されます。

クラスを複数の機会に使用することは可能ですが、ToArrayは引き続き使用できますか？この例では、2番目のULに影響を及ぼしていて、トレースを実行しても、["4weight10"、 "3weight20"、 "2weight30"]が返されます。

私は以下の私のコードを貼り付けますが、それは少し冗長です...

function makeSortable(){ 
    var before; 
    var weight; 
    var newWeight = []; 
    var newID = []; 

    $(".grouped-articles-list").sortable({ 
     tolerance: 'pointer', 
     items: "li:not(.sortable_disabled)", 
     start: function(event, ui){ 
      newWeight.length = 0; 
      var resultbefore = $(".grouped-articles-list").sortable('toArray'); 
      before = resultbefore; 
      //goes through each item and saves their weight to an array 
      $.each(before, function(i) { 
      newWeight.push(splitWeightFromId(before[i])[3]);    
      }); 
     }, 
     stop: function(event, ui) { 
      newID.length = 0; 
      var after = $(".grouped-articles-list").sortable('toArray'); 
      $.each(after, function(i) { 
      //goes through each item in the array and saves out their id 
      newID.push(splitWeightFromId(after[i])[1]); 
      // Only adds changed items 
      if (newID[i] !== splitWeightFromId(before[i])[1]){ 
      //as the items move, but the weights stay the same 
      //sends the affected ID with the always stationary weight off 
       change_weight(newID[i], newWeight[i]) 
     }  
    }); 
}); 

function change_weight(link_id, new_weight) { 
    $.ajax({ 
     type: "PUT", 
     url: "/article_relationships/" + link_id, 
     data: {article_relationship : { 
            weight : new_weight 
            } }, 
     datatype: "js", 
     remote: "true" 
     }); 
} 

はお時間をいただき、ありがとうございますAjaxの機能、

任意のヒント、ヒントまたは提案は大歓迎以上です。

Answer 1

私はこれを修正することができましたが、より良い方法かもしれませんが、配列を作成し、各項目のためにそれを通過するとうまくいきました。

sortableArray = ($('.grouped-articles-list')); 
    $(sortableArray).each(function(index){ 
    $(sortableArray[index]).sortable({ 
     tolerance: 'pointer', 
     items: "li:not(.sortable_disabled)", 
     start: function(event, ui){ 
      newWeight.length = 0; var resultbefore = $(sortableArray[index]).sortable('toArray');