14

I have a sortable list like this one: http://jqueryui.com/demos/sortable

Is it possible to get the start and end position of the element in the list, when it has been moved? I'm talking about their position number, in the list.

For example, if I move element 2 to position 5 in the list, I'd like to assign those two numbers to variables.

I'm new to jQuery - any help would be much appreciated.

1
  • 3
    This is such a great example of the terrible API design of jQuery UI Apr 25, 2011 at 11:34

3 Answers 3

33

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
3
  • 1
    +1 Nice concise answer, but you don't need to wrap the ui.item, it's already a jQuery object. So instead of $(ui.item) use ui.item
    – Mottie
    Mar 14, 2010 at 18:03
  • Elegant answer! Thank you so much. I guess the ui.item object is what I was looking for, here.
    – Wurlitzer
    Mar 14, 2010 at 18:42
  • 1
    +1, although you should probably use ui.item.data('start_pos', start_pos); in start and var start_pos = ui.item.data('start_pos'); in update rather than polluting the id.
    – Alconja
    Nov 5, 2010 at 5:06
1

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

1

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);
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.