Getting the position of the element in a list when it's drag/dropped (ui.sortable)

  • demo: http://so.lucafilosofi.com/getting-the-position-of-the-element-in-a-list-when-its-drag-dropped-ui-sortable/

SOLUTION:

$(function() {
    $('ul#sortable').sortable({
        start: function(event, ui) {
            var start_pos = ui.item.index();
            ui.item.data('start_pos', start_pos);
        },
        update: function(event, ui) {
            var start_pos = ui.item.data('start_pos');
            var end_pos = ui.item.index();
            alert(start_pos + ' - ' + end_pos);
        }
    });
});
  • NOTE: Updated to make use of jQuery data() method under advice of Alconja

I believe what you are looking to do is done with the serialize method. Serialize is get the new order of the list.


For some reason ui.item.index() did not work for me.

This did:

update: function (event, ui) 
{
    var index = $('li', $(ui.item).parent()).index(ui.item);
    alert(index);
}