Jquery ui – classable: faites glisser par icône ‘handle’ dans l’élément sortingable

J’ai des jquery ui sortables qui fonctionnent bien mais mes éléments sortingables ont d’autres éléments interactifs. Afin d’éviter un sorting accidentel lors de l’interaction avec les éléments contenus dans les divs sortingables, j’aimerais que le mouvement de glissement des sortingables ne se produise qu’en glissant un certain élément dans le sorting, par exemple une icône de déplacement pouvant résider dans le coin supérieur gauche de chaque sorting. Est-ce possible avec le jqui générique, ou devrais-je écrire mon propre hook?

Le handle d’ option du plugin vous permet de définir l’élément qui peut initier le sorting. Vous pouvez fournir un sélecteur ou un élément.

Si vous avez ce HTML, avec le .handler pour être le handle pour démarrer le sorting:

 
  • My element

Appliquez l’option comme ceci:

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

Vous pouvez styler votre élément de poignée comme vous le souhaitez.