Opened 9 years ago

Last modified 6 years ago

#4990 open bug

sortable: Small placeholders compute overlap wrong

Reported by: dwt Owned by:
Priority: major Milestone: 2.0.0
Component: ui.sortable Version: 1.7.2
Keywords: Cc:
Blocked by: Blocking:

Description

When using sortables with much smaller drop-targets the computation of the overlay at which to switch the drop placeholder below the drop target is wrong.

It is not computed with the new location of the drop target, but instead with the old location of the drop target.

To clarify

+------------- | first item in draggable list (item I want to drag) | quite big | | | | | +------------- +------------- | second item (item I want to drag the first below) (quite small) +-------------

The dropable placeholder is styled with css to be 10px tall, so it is much smaller than both the items, which themselves have different sizes. (other options are at their defaults, so overlap should be 50% to make the drop target jump below the original)

Now when I start dragging the first item, the second item moves up a great deal (due to the placeholder being very small) but to make the placeholder move below the dropped target you have to move the first item to a position where it would overlap the second item more than 50% at its location before the drag was started.

After this is done once, the overlap calculation works correctly - but is still repeatable when doing a fresh drag.

Change History (4)

comment:1 Changed 9 years ago by dwt

ok, the ascii image got eaten, here it is again:

+------------- 
| first item in draggable list (item I want to drag) 
| quite big 
| 
| 
| 
| 
| 
+------------- 
+------------- 
| second item (item I want to drag the first below) (quite small) 
+-------------

comment:2 Changed 8 years ago by SpadXIII

This bug is still present in the latest jquery ui 1.8.10 (downloaded today)

Easy check using the placeholder-demo: remove all items except 2 and alter the styling of first item to height:800px;. When dragging the big item, it doesn't change positions until it's dragged 400px down. After this, the dragging around works fine.

edit: a work-around is to call refreshPositions in the start-event.

Last edited 8 years ago by SpadXIII (previous) (diff)

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

Milestone: TBD2.0.0

comment:4 Changed 6 years ago by mikesherov

Status: newopen
Summary: sortable with small placeholders computes overlap wrongsortable: Small placeholders compute overlap wrong

Confirmed on latest: http://jsfiddle.net/Cbg44/3/

Note: See TracTickets for help on using tickets.