Opened 6 years ago

Closed 6 years ago

#10048 closed bug (duplicate)

Connected sortable with small height not triggered when pointer not over it

Reported by: sandr Owned by: sandr
Priority: minor Milestone: none
Component: ui.sortable Version: 1.10.4
Keywords: Cc:
Blocked by: Blocking:

Description

When moving an item to a connected sortable, it is usually triggered when the helper item hovers over it, even if the mouse pointer itself is not over the sortable.

However, if the receiving sortable has a height smaller than the item's height, it doesn't get triggered.

See: http://jsfiddle.net/9aX8n/1/ Tested with Firefox 29.0 / Chromium 34.0.1847.116 Ubuntu 12.04 (260972)

Change History (6)

comment:1 Changed 6 years ago by tj.vantoll

Owner: set to sandr
Status: newpending

HI sandr,

Thanks for taking the time to contribute to jQuery UI. I don't think I understand the problem you're describing. When you say "it doesn't get triggered", are you referring to sorting?

Also you might want to consider adding a min-height to make this example a little easier to test: http://jsfiddle.net/tj_vantoll/9aX8n/2/

comment:2 Changed 6 years ago by sandr

Status: pendingnew

What I mean is this: try to move "item 1" into the "receiver" list: mousedown somewhere in the right half, then move it a little to the right and then move it up (so that "item 1" partially hovers over "receiver", but your actual mouse pointer does not).

If you do this in your example http://jsfiddle.net/tj_vantoll/9aX8n/2/, the receiver reacts by showing the placeholder (and if you release the mouse, the item is moved to the receiver list).

However, in my example http://jsfiddle.net/9aX8n/1/ nothing happens.

Last edited 6 years ago by sandr (previous) (diff)

comment:3 Changed 6 years ago by sandr

The reason that nothing happens in my example seems to be that the receiver container's height is smaller than the helper's height. In the jquery.ui.sortable.js code I find this in the _intersectsWith function:

if ( this.options.tolerance === "pointer" || this.options.forcePointerForContainers ||
  (this.options.tolerance !== "pointer" &&
    this.helperProportions[this.floating ? "width" : "height"] > item[this.floating ? "width" : "height"])
) {
   return isOverElement;
} else ...

which specifies exactly that behavior (for the case that the tolerance option is set to intersect which is the default): if the helper height is larger than the receiver container's height, return true only if the mouse pointer is over the container.

I don't know why this is there. (Maybe it has some use while sorting within one container.)

comment:4 Changed 6 years ago by tj.vantoll

Status: newpending

What is your use case for having a helper that is larger than the receiving container's height? That seems like a bad idea.

comment:5 Changed 6 years ago by sandr

Status: pendingnew

The container grows in height depending on how many items it contains. When it contains no items at all, the height is quite small. (Admittedly this makes it a little hard to drop items into it, but I have many containers on the page, so they can't take up too much space.)

comment:6 Changed 6 years ago by tj.vantoll

Resolution: duplicate
Status: newclosed

Duplicate of #8342.
This is actually the intersect tolerance option not working like it should, and we have a ticket open for that already.

Note: See TracTickets for help on using tickets.