How do I get a draggable to revert to the original position only if it was dragged onto an invalid droppable?

I have an element I want to allow to be dragged anywhere. However, if it is dropped onto a droppable which refuses it (via accept) I want it to revert to the original position before the drag. How can I accomplish this?

EDIT: to be more specific: I want two conditions to be met in order for the item to be moved back: 1. It was dropped on a droppable and 2. The droppable didnt accept said item. Draggable's revert option only checks condition 2.


I have some code which I think should work. Note that it doesn't use the accept option to specify which draggables the droppables will accept. Instead, you'll have to check whether or not a draggable should be rejected manually, in the drop event.

$(document).ready(function() {
        drop: function(event, ui) {
            // check whether or not draggable should be rejected here...
            if (...) {
      'rejected', true);

        revert: false,
        start: function(event, ui) {
  'rejected', false);
  'original-position', ui.helper.offset());
        stop: function(event, ui) {
            if ('rejected') === true) {

You want to use sortable dude - something like:

    accept: '.child',
    items: '.child',
    revert: 300,
    opacity: 0.8,
    containment: 'document'

This should automatically snap the element back if it isn't far enough to replace one of the other elements. You just put this on the container

Need Your Help

Very slow requests to dynamodb from lambda function

amazon-web-services amazon-dynamodb aws-lambda amazon-lambda

I have lambda function and dynamo db table in the same region (us-east-1). In lambda function I perform very simple query:

Using a List as ComboBoxModel

java swing jcombobox comboboxmodel

I have a LinkedList of objects which is often changed by another thread and I also have a JComboBox which should show all these objects synchronous to the state of the list.