jQuery UI Sortable - ロード位置

Question

このコードを使用して、jquery-uiでソートされたdivの位置を保存しています。

コードは素晴らしいですが、私の質問は...私は一度保存された位置に再び読み込むことができますか？

ここで私は位置に保存するために使用しているコードです。

<div id="sortable"> 
    <div id="2000"></div> 
    <div id="1000"></div> 
    <div id="3000"></div> 
</div> 

$('#sortable').sortable({ 
    update: function() { save_new_order() } 
}); 

function save_new_order() { 
    var a = []; 
    $('#sortable').children().each(function (i) { 
     a.push($(this).attr('id') + ':' + i); 
    }); 
    var s = a.join(','); 
    alert(s); 
    localStorage.setItem("positions", s); 
} 

どうやってロードすることができますか？

Answer 1

値を取得して、次のように順序を更新できます。

$(function() { 
    var $sortable = $('#sortable'); 
    var positions = JSON.parse(localStorage.getItem('positions')); 
    if (positions) { 
    $.each(positions, function(i, position) { 
     var $target = $sortable.find('#' + position); 
     $target.appendTo($sortable); // or prependTo for reverse 
    }); 
    } 

    $sortable.sortable({ 
    update: saveNewOrder 
    }); 

    function saveNewOrder() { 
    var positions = JSON.stringify($sortable.sortable("toArray")); 
    localStorage.setItem('positions', positions); 
    } 
}); 

JSFiddle demo