Question

I’m using sortable with JqueryUI. I’m trying to get the current item I had just dropped in the receiving list. However and echo of $(this).text() reveals the values of all the items in the list. Any ideas?

$(function() {
    var lists = [{"listid":"#all-colls-list", "connectid":"#coll-selected-list", "drop":true},
     {"listid":"#coll-selected-list", "connectid":"#all-colls-list", "drop":true}];
$.each(lists, function(i, list) {
        $(list.listid).sortable({
            connectWith: list.connectid,
            dropOnEmpty: list.drop,


    $( "#coll-selected-list" ).sortable({
           remove: function(event, ui) { 

           },
           receive: function(event, ui) { 
                alert($(this).text());
           }
        });

}
        });
    });
});
<ul id="all-colls-list" class="droptrue sort-drop ui-sortable">
      <li class="sorted">apple</li>
      <li class="sorted">pear</li>
      <li class="sorted">banana</li>
      <li class="sorted">grape</li>
      <li class="sorted">guava</li>
</ul>

<ul id="coll-selected-list" class="droptrue sort-drop ui-sortable">
</ul>

<ul id="coll-grouped-list">
</ul>​

Answer 1

From the sortable documentation:

ui.item – the current dragged element

http://jqueryui.com/demos/sortable/

Example of use (kindly posted by Steve in his fiddle):

$(ui.item).text()