I have a nested set of jQuery droppables...one outer droppable that encompasses most of the page and an a set of nested inner droppables on the page. The functionality I want is:

• If a draggable is dropped outside of any of the inner droppables it should be accepted by the outer droppable.

• If a draggable is dropped onto any of the inner droppables it should NOT be accepted by the outer droppable, regardless of whether the inner droppable accepts the draggable.

So that would be easy if I could guarantee 1+ inner droppables would accept the draggable, because the greedy attribute would make sure it would only get triggered once. Unfortunately the majority of the time the inner droppable will also reject the draggable, meaning the greedy option doesn't really help.

Summary: The basic functionality is a set of valid/invalid inner droppables to accept the draggable, but when you toss the draggable outside any of the draggables it gets destroyed by the outer droppable.

What's the best way of doing this?