4

jQuery用のきちんとした並べ替えプラグインであるHTML5並べ替え可能http://farhadi.ir/projects/html5sortable/を使用していますが、データをシリアル化してAJAX POSTリクエストとして送信する（DBを更新する）理想的な方法が見つかりません。

HTML

<ul class="sortable">
    <li data-id="1">One</li>
    <li data-id="2">Two</li>
    <li data-id="3">Three</li>
    <li data-id="4">Four</li>
    <li data-id="5">Five</li>
</ul>

jQuery

$('ul.sortable').sortable().bind('sortupdate', function() 
{
   var data = ??;  // serialize all data-id's ... this is my problem

   $.post('/sortupdate.php',data,function(){ // PHP script sets new order in DB
       alert('updated');
   });
});

だから私がしたいのは、LIアイテムを新しい位置にドラッグすると、sortupdateイベントが関数をトリガーし、data-id属性値の新しい順序を送信する必要があるということです。私の現在の考えは、LIをループして、属性値を配列に追加することです。これを行うためのよりスマートな方法はありますか、またはループを行うための最も効率的な方法は何ですか？（私は主にあなたが知っているバックエンドの人です）。ありがとう！

4

1 に答える 1

9

プラグインには組み込みのシリアル化メソッドが付属していないため、手動で行う必要があります。

var dataIDList = $('ul.sortable li').map(function(){ 
    return $(this).data("id");
}).get().join(",");

（これは基本的に最後に説明したものであり、ループしてリストを作成します。）

これで、リストとして投稿できます。

$.post(url,{ idlist: dataIDList }, completeandler);

配列として投稿することもできます。削除するだけです。.join(",");

于 2012-11-27T19:36:15.490 に答える