JQuery Draggable + Droppable + Sortable

Question

I'm sure this has been answered before but I can't find an example to fit my situation. I've got a list of images that are draggable. I've also got a div (id="dropZone") that is set to droppable and sortable. I'd like to fire a function when the images get dragged and dropped on the div, but not when things are dropped on the div from being sorted. Here's what I tried:

stop: function() { $('#dropZone').prepend('<img src"img.png" />'); }

This I added to the droppable images, however this will fire even when they are dropped outside the droppable.

drop: function() { $('#dropZone').prepend('<img src="img.png" />'); }

Then I tried adding this to my droppable, but this adds the image both when it is dropped from being dragged, and sorted.

Anyone know what I need to do?

Answer 1

The question is vague but it seems like what you need is the receive event from sortable.

$( ".selector" ).sortable({
   receive: function(event, ui) { ... }
});

http://jqueryui.com/demos/sortable/#connect-lists

This event will occur only when an item is received from another connected list.