How to test whether atleast one item has be dropped on JQuery UI Droppable?

I have a div that is 'designated' as droppable: $( "#droppable_div" ).droppable.

On the other hand, I have multiple draggable divs that are made draggable by assigning a CSS class which has been designated as draggable: $(".draggable_css").draggable.

Now, both these are in a form. So, when I submit a button, I need to test whether atleast one of the draggable items/divs have been dropped on the droppable div.

Can someone please suggest how this can be done?

Solution

You could count the number of child of your droppables div.

Here is a fiddle : http://jsfiddle.net/kn7uF/

And the code :

<div id="droppable_div1"></div>
<div id="droppable_div2"><div id="find-me"></div><div id="find-me"></div></div>

<script>
    alert("There are "+$( "#droppable_div1 > #find-me" ).size()+" elements in the droppable_div1")    
    alert("There are "+$( "#droppable_div2 > #find-me" ).size()+" elements in the droppable_div2")
</script>