jQuery how to find the class of the Droppable Div ?

Question

Hi all

I have two divs: one draggable and one droppable

<div id="draggable" class="block" runat="server">
</div>

<div id="dd" class="drop" title="drophere">
</div>

When I release the draggable div I want to find the class of it's parent to take an action if it is dropped on a droppable div, otherwise cancel the dragging.

I want to put a condition in the stop function of the draggable that if it's dropped on a div with class "drop" then it's ok, otherwise cancel the drag operation

What can be the function that performs this ?

thanks.

Answer 1

Normally you would do this by using the draggable and droppable plugins like this...

$(".block").draggable();

$(".drop").droppable();

Which gives you the behaviour you are after (i.e. you can only drop on a droppable).

Answer 2

There are custom events that you can use, in your particular case stop.

$( ".selector" ).draggable({
   stop: function(event, ui) {
      // get the parent here
   }
});

Answer 3

Thanks All

I got it at this link http://jqueryui.com/demos/droppable/#revert

this makes the div reverts if not dropped on a droppable.