twitter-bootstrap - ブートストラップでソート可能

Question

divをソート可能にするために次のコードを使用しています

$('.outersortable').sortable({ 
    handle: ".drag", 
    cursor: "e-size",
    placeholder: "ui-state-highlight", 
    axis: "y" });

ajax 呼び出しを実行して変更を保存したい (div の順序) だけでなく、div をドラッグ可能にするだけで、div を置き換えません。

Answer 1

updateユーザーが並べ替えを停止し、DOM の位置が変更されたときに発生する並べ替え可能なイベントを使用する必要があります。

現在の要素の順序を取得し$('.outersortable').sortable("toArray");、jQueryajax関数を使用してバックエンドに送信します。

完全な例:

$('.surEdOuterSortable').sortable({ 
    handle: ".spritesHandlerIcon", 
    cursor: "e-size",
    placeholder: "ui-state-highlight", 
    axis: "y" 
    update: function(event, ui) {
        order = $('.outersortable').sortable("toArray");

        $.ajax({
            url: 'controller/action',
            data: {order:order},                        
        });
    }
});