如何在数据库中存储已排序的jQueryUI排序列表[重复]

I've implemented a drag & drop sorting list using jqueryui like in the example bellow.

HTML

<ul id="sortable1" class="connectedSortable">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
  <li class="ui-state-default">Item 4</li>
  <li class="ui-state-default">Item 5</li>
</ul>

<ul id="sortable2" class="connectedSortable">
  <li class="ui-state-highlight">Item 1</li>
  <li class="ui-state-highlight">Item 2</li>
  <li class="ui-state-highlight">Item 3</li>
  <li class="ui-state-highlight">Item 4</li>
  <li class="ui-state-highlight">Item 5</li>
</ul>

Javascript

 <script>
  $( function() {
    $( "#sortable1, #sortable2" ).sortable({
      connectWith: ".connectedSortable"
    }).disableSelection();
  } );
  </script>

I've created an update button below all this. I have to store the rearranged list into an database after the update button has been pushed.

But I have no idea how to do it, i need some advices, I don't know where to start.

Thank you.

</div>

With single list of items, you can do like this

<form>
<ul id="sortable1" class="connectedSortable">
  <li class="ui-state-default">Item 1<input type="hidden" name="sortorder[]" value="1" /></li>
  <li class="ui-state-efault">Item 2<input type="hidden" name="sortorder[]" value="2" /></li>
  <li class="ui-state-default">Item 3<input type="hidden" name="sortorder[]" value="3" /></li>
  <li class="ui-state-default">Item 4<input type="hidden" name="sortorder[]" value="4" /></li>
  <li class="ui-state-default">Item 5<input type="hidden" name="sortorder[]" value="5" /></li>
</ul>
</form>


$( "#sortable1" ).sortable({
    cursor: "move",
    items: "> li",
    update: function() {
        var neworder = $('#sortable1').parent('form').serialize();
        $.ajax({
            data: neworder,
            type: 'POST',
            url: 'updateportfolioorder.php'
        });
    }
});