jQuery Drag and Drop Checking Question

Question

i am new to using jQuery and I just want to know how I can check whether a draggable object has been removed from the droppable object.

Example, i have a dog and I dragged it to a doghouse which has a lightbulb that will light up indicating that the dog is there. When i drag the dog out of the doghouse, the lightbulb should go off again indicating the dog's absence.

Help me please coz I really don't have any idea how to do this. Thanks in advance. :)

Answer 1

You could use the the [drop event][1] embedded in UI / draggable. Here's some example code:

$("#doghouse").droppable(
    {drop:function(event,ui){
        if (ui.draggable[0].id=="dog"){
            //show lightbulb
        }
    });