Question

I have sortable objects that I need to record the ID of the .next() object. The first time it needs to be recorded is when you mousedown and object (to get the ID of the .next() object) and the second time to get the ID .next() object where it is placed.

I can use mousedown to get the first .next() ID.

$(function() {
    $( "#sortable" ).sortable();
    $( "#sortable" ).disableSelection();
});

$("li").live("mousedown",function(e) {
    document.getElementById("result").innerHTML=($(this).next("li").attr('id'))
});

But what can I use to get the ID of the .next() object after it is placed?

For clarity, here is a JSfiddle document:

http://jsfiddle.net/TSM_mac/pJbeB/

Answer 1

Here’s a live demo

Here’s the code

$(function() {
    $( "#sortable" ).sortable({
        start : function(event, ui) {
            $('#result').html($(ui.item).next().next().attr('id'));
            //we have to use .next().next() because jquery creates a dummy
        },
        stop : function(event, ui) {
            $('#result').html($(ui.item).next().attr('id'));
        }
    });
    $( "#sortable" ).disableSelection();
});

Notice the use of next().next(), this is intentional.

Have a look at the API for the list of available events/methods when working with sortable : http://jqueryui.com/demos/sortable/