Two sortables stacked using z-index

[Andrei Glingeanu]

I have this setup. JSFiddle: ​https://jsfiddle.net/andreiglingeanu/acnvzvbj/2/) link.

The main idea is that, as you can see, is that the dark sortable is above the first one, it is positioned using position: absolute and z-index. I have a little bit of opacity for the black one, just so I can look what happens with the first sortable.

Below the bottom red square we have two indicators that shows when receive (​http://api.jqueryui.com/sortable/#event-receive) event is fired on the specific sortable.

Please note the fact that when you drop an item onto the blue sortable, only indicator for this sortable is fired. When I drop a new item onto the black one, a receive event is fired on both sortables.

Is this behavior a desired one? I think, in this case just the dark one have to receive this event.

[Scott González]

So you want greedy, non-nested sortables? This seems like a fairly confusing interface. Can you please describe why you are building a UI like this?

[Andrei Glingeanu]

Replying to scottgonzalez:

So you want greedy, non-nested sortables? This seems like a fairly confusing interface. Can you please describe why you are building a UI like this?

I thought it is more logical to fire receive event just for the element with the bigger z-index. I'm wrong?

I have build an UI where the user drags an element onto multiple sortable. After that, the elements can be move from one sortable to another. By the design, I'm forced to put one sortable above the other, there's no way around it. And also my logic is coupled with receive event. Maybe there's some way around this, involving some temporary variables, not sure.

I believe the fix is a matter of tweaking this lines a bit: ​https://github.com/jquery/jquery-ui/blob/master/ui/widgets/sortable.js#L1236. Let me know if you want more details about the UI I'm doing.

[Scott González]

We'll consider this during the rewrite, but this is unlikely to get any attention for a while unless someone submits a patch along with tests.