Jquery ui - sortable: drag by icon 'handle' within sortable element

Question

I have jquery ui sortables working fine but my sortable elements have other interactive elements within them. In order to prevent accidental sorting when interacting with the el

Answer 1

The option handle of the plugin allows you to define that is the element that can initiate the sort. You can provide a selector or an element.

If you have this html, with the .handler to be the handle to start the sort:

    

        
        My element
    

Apply the option like this:

$( ".sortable" ).sortable({ handle: '.handle' });

You can style your handle element however you like.