jQuery 2.0.0 breaks jQuery-ui sortable when items are removed and re-added to the sortable

[[email protected]…]

Our application uses jQuery UI Sortable and removes elements from the sortable container and re-adds them as part of our render process. With jQuery 1.9.1, this works fine - here is a demonstration using the sortable demo and jQuery 1.9 in jsfiddle: ​http://jsfiddle.net/8Qe8T/3/

With jQuery 2.0.0, the first drag after the remove/re-add fails, and subsequent drags succeed. It seems as though other handlers are affected, as well:

​http://jsfiddle.net/8Qe8T/4/

The changeset that breaks this is the rewrite of data.js at ​https://github.com/jquery/jquery/commit/7f94a5cc3a167a710576c008da2c186a98ce2dd4

It seems like there is something new and undesirable happening with remove and event handlers, and that the effects will probably not be confined to sortables.

[dmethvin]

When you .remove() elements from the document it destroys all data and events attached. Seems likely that an initialized sortable has stuff that shouldn't be removed. When I use .detach() the example seems to work fine.

I'd be curious as to why the behavior changed but first I'd like to know if this example is valid or not. Scott do you want to weigh in?

[anonymous]

But the mousedown handler is on the container, not the elements within the container, and that's what appears to not be triggered on the first drag.

[scottgonzalez]

This is a valid use. I've reduced the fiddle and added a call to sortable's .refresh() method: ​http://jsfiddle.net/8Qe8T/9/

[scottgonzalez]

My reduced test case was missing an .end() for the .appendTo(). This is working fine when calling sortable( "refresh" ): ​http://jsfiddle.net/8Qe8T/10/

[anonymous]

Ah, okay, so the fact that this worked without needing a call to 'refresh' prior to jQuery 2.0.0 would fall into the 'happened to work' rather than the 'supposed to work' category.