Opened 10 years ago

Last modified 7 years ago

#4933 open feature

Droppable: ability to have drop event fire once for overlapping droppable zones

Reported by: hyj1254 Owned by:
Priority: minor Milestone: 2.0.0
Component: ui.droppable Version: 1.7.2
Keywords: haspatch Cc:
Blocked by: Blocking:

Description

hi,

Please visist http://jsbin.com/aqaka/edit , then the

problem will appear.

The key point is that the 2 DIVs set to be droppable are

overlapping,then the event of Dropping is triggered twice.

Thanks.

Attachments (1)

ui.droppable.patch (2.2 KB) - added by silverj 10 years ago.
Possible fix. drop() will only be called for the elements with highest z-index

Download all attachments as: .zip

Change History (6)

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

Component: ui.coreui.droppable
Milestone: TBD1.8

Changed 10 years ago by silverj

Attachment: ui.droppable.patch added

Possible fix. drop() will only be called for the elements with highest z-index

comment:2 Changed 10 years ago by silverj

If there are overlapping droppables that are not nested (floating or absolute position), the bottom-most droppable would catch the draggable element. To fix this, the function isOnTop() was added and is used in _drop function. The isOnTop determines if the droppable is the top-most droppable. If it is not, then the draggable will not be accepted. The check is done after calling the "accept" function.

To determine the top-most droppable, all droppables that are intersecting with the draggable (the intersect function was used, similarly to how it's used for the "greedy" option) are checked and the one with highest z-index is declared as the top-most droppable. To use it, z-index properties must be added to relevant elements. Browsers use "auto" for missing z-index property - this is considered to be zero in the patch.

We added a configuration option for the functionality - acceptFallthrough. If set to true, the isOnTop check is skipped. The default value is set to false because in our opinion the droppable elements that are not visible (covered by other droppables) shoult not have the drop function executed.

comment:3 Changed 10 years ago by nxtwrld

This fix created another minor problem: I have 2 droppables on top of each other. When I drag I hover above element 1, causing the activateClass to turn itself on. Then I hover on top of element 2 I drop the element causing the drop() to be triggered for element 2. However the activateClass from element 1 gets never turned off after finishing the drag/drop operation.

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

Milestone: 1.9.02.0.0

comment:5 Changed 7 years ago by mikesherov

Keywords: haspatch added
Status: newopen
Summary: drop once but trigger twice in drop event OptionsDroppable: ability to have drop event fire once for overlapping droppable zones
Type: bugfeature
Note: See TracTickets for help on using tickets.