sortable + draggable demo - how to get access to dropped item?
I have a sortable list. When a new 开发者_运维技巧item is dropped into the list (from a draggable), I'd like to get access to it to perform some operations on it. This is what I have:
$("#mySortableList").sortable({
receive: function(event, ui) {
alert("this is the dropped item: " + ui.item.toString());
}
}).disableSelection();
so "ui.item" is the element that was dropped, but it's not the duplicated item that will now be part of my list. How do I get access to the new item that was dropped? I am using the exact demo from the jquery-ui site here: http://jqueryui.com/demos/draggable/#sortable
Thanks
You can get the item in the stop
event and check that it came from the draggable (it doesn't have a handle attached, which it would if it was from the sortable), like this:
$("#mySortableList").sortable({
stop: function(event, ui) {
//check it wasn't here previously
if(!ui.item.data('tag') && !ui.item.data('handle')) {
ui.item.data('tag', true); //tag new draggable drops
alert("this is the dropped item: " + ui.item.toString());
}
}).disableSelection();
You can see a demo to play/test with here, since a handle doesn't get added, at least not in a way that matters, we're tagging items dropped from the draggable so that they won't fire the alert again when moved inside the sortable.
I am currently removing the received item like this:
$(this).data().sortable.currentItem.remove(); --now to find its INDEX!
精彩评论