1

I've got some problems with JQuery - Draggable/Droppable. I've been googling around and also searched this forum. The problem is somewhat solved, but I've got a situation that still leads to unwanted results.

I worked forward with some answers in this thread: jQuery UI - Droppable only accept one draggable.

So my mission is basically to have a drag and drop system where only one Draggable item can land on a Droppable one. Ok, firstly, if the Draggables already been put out, you need to set that their Droppables are busy. I used a create function for that.

Here's some code:

$('.droppable').droppable
({
    hoverClass: "ui-state-active",
    drop: function (event, ui) {
    $(this).droppable('option', 'accept', ui.draggable);
    },
    out: function (event, ui) {
        $(this).droppable('option', 'accept', '.draggable');
    },
    create: function (event, ui) {
        if ($(this).find('.draggable').length == 1) {
            $(this).droppable('option', 'accept', $(this).find('.draggable'));
        }
    },
});


$('.draggable').draggable
({
    revert: 'invalid',
    cursor: 'move',
    zIndex: 10000
});

My problem: If a user drags an item and fails to put it on an accepting Droppable, it reverts. This means that it has not been dropped and the drop: function never runs. This means that this Droppable now accepts each item of the draggable class, even if there's is an item (the one that reverted) there. What can one do about this? I hope you see what I mean here.

I hope I've done everything right now, If not, let me know.

Thanks!

Community
  • 1
  • 1
Zoizaite
  • 11
  • 4
  • You may need to leverage the **start** and **stop** events of draggable. The stop event fires after a draggable item is done being dragged that may be a good time to toggle a class on the droppable to stop accepting new items. – Malkus Nov 14 '12 at 11:53
  • I can actually fire an event when an item is being reverted, but then I need to know which Droppable that is, and set that to accept just its "child". – Zoizaite Nov 19 '12 at 10:46

0 Answers0