21

When using Jquery UI Sortable (which is great by the way) how do you get the item that is currently being sorted.

When you use $(this); it return the actual sortable list, not the current sorted item.

I want to do fancy-pants things with the widget when the user is dragging it around. E.g. Animate it when dragging between two lists.

So how do I get the current item being sorted?

There a little code below just to explain a little more...

$(function() {
    $("#sortable_1").sortable({
        start : function(event, ui){ 
            //get current element being sorted
        },
        stop : function(event, ui){ 
            //get current element being sorted
        }
    }).disableSelection();
});

1 Answer 1

44

As far as I'm aware ui in your start: function(event, ui) is the current element being sorted.

As pointed out in the comments ui.item is the current element.

4
  • 2
    Cheers. It's ui.item but ui is close enough. Have a tick.
    – CafeHey
    May 18, 2010 at 10:34
  • How we then use ui.item along with jQuery for example removing a class from it? this does not work ui.item.removeClass("invisible"); for me May 29, 2020 at 20:15
  • 1
    @limitcracker if you're still looking I think it would be $(ui.item).removeClass("invisible");
    – Nalum
    Dec 4, 2020 at 12:14
  • I would add that ui.item returns an object, so if you really want the element you should use ui.item[0]. This way you can get a normal JS element. Now you could do for example 'ui.item[0].classList.add("yourClass")`.
    – Enrique
    Sep 30, 2022 at 19:32

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.