0

I have the following code:

Droppable area

$( "#droppable1" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                .html( "Dropped!" );
        }
    });

$( "#droppable1" ).on( "dropout", function( event, ui ) {
                 $( "#droppable1" )
                .removeClass("ui-state-highlight").find( "p" )
                .html( "Drop Here" );
   });

Dragable item

$( "#draggable1" ).draggable({ 
     snap: ".ui-widget-header", 
     snapMode: "inner", 
     axis: "y", 
     containment: "#containment-wrapper", 
     scroll: false 
});

All works fine BUT I cannot understand or work out how I prevent a droppable space from accepting multiple drops if an item has already been dropped into it.

  1. How would I modify the code to prevent #droppable1 from accepting more than one drop?
  2. Is it possible to use the .return option so that if one tried to drop an additional item, it would merely revert back to its original position?

EDIT:

$(".drop-zone").droppable({
drop: function(event, ui) { 
    $(this).droppable('option', 'accept', ui.draggable);
},
out: function(event, ui){
    $(this).droppable('option', 'accept', '.drag-item');
    }   
});

});

The above is from the thread listed below but I am struggling to implement with my code.

New code

$( "#droppable1" ).droppable({
        drop: function( event, ui ) {
            $(this).droppable('option', 'accept', ui.draggable);
        },
        out: function(event, ui){
            $(this).droppable('option', 'accept', '.drag-item');
        }   

    });

OK, so I now have the code working above BUT this is actually, I don't think, what I need. Is there any way to STOP a draggable item actually being dropped and/ or snapped on a populated droppable space?

Thanks as always,

H.

Homer_J
  • 3,277
  • 12
  • 45
  • 65
  • 2
    [see this thread](http://stackoverflow.com/questions/3948447/jquery-ui-droppable-only-accept-one-draggable) – pmandell Nov 30 '12 at 16:54
  • Thanks for the link but I'm struggling to implement that code within mine! It seems to bready my jQuery. – Homer_J Nov 30 '12 at 17:53

0 Answers0