Draggable: ui-draggable-handle class is added to all matching elements on the page

[mizzao]

I had a page with a lot of potential draggables and dynamic changes using Meteor, so instead of activating the draggable methods all at once, I created them on mouseenter and destroyed them on mouseleave.

While this adds and removes the ui-draggable class correctly as elements are moused over, the ui-draggable-handle is added to all matching handle elements on the page as soon as any draggable is moused over. The class is still removed on an individual destroy.

To see this, go to this fiddle and mouse over the elements with their classes visible in Chrome's developer tools.

​http://jsfiddle.net/4zE3p/ or ​http://jsfiddle.net/4zE3p/embedded/result/

This appears to occur from ​https://github.com/jquery/jquery-ui/blob/1.11.0/ui/draggable.js#L318 where if a selector like ".handle" is passed in as an option, $(".handle") is going to select all handles on the page - instead of just one descendant handle. This behavior did not occur in 1.10.4 as there was no ui-draggable-handle class used in that release.

Moreover, setting {addClasses: false} does not disable this behavior because _setHandleClassName does not check the value of addClasses: ​https://github.com/jquery/jquery-ui/blob/1.11.0/ui/draggable.js#L73

[tj.vantoll]

Thanks mizzao. The query to find handles should search within the element and not globally. I can patch this.

[tj.vantoll]

PR: ​https://github.com/jquery/jquery-ui/pull/1284

[TJ VanToll]

Draggable: Only apply ui-draggable-handle within the draggable instance

Fixes #10212 Closes gh-1284

Changeset: 7594a3142547e078326872cb0d6e2d7f32f4c808