save jquery ui-sortable positions to DB

make your HTML sortable, add javascript, and save to php on update.

<ul id="sortable">    <li id="1">elem 1</li>    <li id="2">elem 2</li>    <li id="3">elem 3</li>    <li id="4">elem 4</li></ul>$(document).ready(function(){    $('#sortable').sortable({        update: function(event, ui) {            var newOrder = $(this).sortable('toArray').toString();            $.get('saveSortable.php', {order:newOrder});        }    });});

I know this is old, but what I do is just add a hidden input element in every LI. They would all have a the same name with [] at the end. This way, when you post the form containing the UL, you will get an array in your post values in the order you just put your list.

According to the Sortable docs we have to prefix the LI's id with some string.Then if we serialize the sortable in the update method we'll get a nice array in php e.g. new_order[]=1&new_order[]=2 etc.

var data = $(this).sortable('serialize');<ul id="sortable">    <li id="new_order_1">elem 1</li>    <li id="new_order_2">elem 2</li>    <li id="new_order_3">elem 3</li>    <li id="new_order_4">elem 4</li></ul>