Opened 11 years ago

Closed 9 years ago

Last modified 8 years ago

#3452 closed feature (wontfix)

Gestion of stacked droppable.

Reported by: Daazku Owned by: paul
Priority: major Milestone: 1.9.0
Component: ui.droppable Version: 1.6rc1
Keywords: Cc:
Blocked by: Blocking:

Description

When we have some stacked droppable we must be able to choose how to handle the event. All droppable are affected? Only the top one (Z-index / DOM hirarchy)?

Currently we can't choose so all droppable execute the event.

(If we go further we can apply this concept to draggable. Chose to drag the top one or all the draggable under the mouse)

Change History (9)

comment:1 Changed 11 years ago by Scott González

Priority: blockermajor

I don't feel that this is a blocker since it's possible to implement this as a user of the plugin by doing the checks on your own and using the start callbacks.

comment:2 Changed 11 years ago by paul

Resolution: fixed
Status: newclosed

This is already possible. For once, there's the greedy option that triggers the drop only on the most inner droppable you're over, but then, events also started to bubble, so you can now prevent the propagation.

comment:3 Changed 11 years ago by Scott González

Milestone: TBD1.later
Resolution: fixed
Status: closedreopened

This isn't about nested droppables, it's about siblings that are positioned on top of each other.

comment:4 Changed 10 years ago by Scott González

Milestone: 1.later1.8

comment:5 Changed 10 years ago by paul

I don't think this is possible without significant overhead - you need to compare all positions of all droppables against all other droppables and find out if they're nested. I would prefer not to support this edge case.

comment:6 Changed 9 years ago by Scott González

Resolution: wontfix
Status: reopenedclosed

comment:7 Changed 9 years ago by randynwalsh

This was something I really wanted to do, so found a way to have nested (overlapping) DIV's catch the right drop. I did this by using the over and out events, and keeping track of them on a stack. Here's my code, hope it helps you.

$(widget).droppable({

activate: function (event, ui) {

$.hoverStack = []; reset on start of a drag

},

over: function (event, ui) {

$.activeDrop = this; $.hoverStack.push($(this));

},

out: function (event, ui) {

$.hoverStack.pop(); if ($.hoverStack.length) $.activeDrop = $.hoverStack[$.hoverStack.length - 1]; else $.activeDrop = null;

},

drop: function (event, ui) {

if (!$.activeDrop) $.activeDrop = this; alert('Dropped on id: ' + $($.activeDrop).attr('id') + '<br />');

}

});

comment:8 Changed 8 years ago by Scott González

#7637 is a duplicate of this ticket.

comment:9 Changed 8 years ago by Scott González

#7776 is a duplicate of this ticket.

Note: See TracTickets for help on using tickets.