jQuery Sélectionnable - désélectionner un seul élément en cliquant - est-ce possible?

Question

Je voudrais pouvoir désélectionner un élément sélectionné en cliquant ou en utilisant le lasso, comme dans Photoshop où je garde une autre touche enfoncée pour "désélectionner" des parties d'une sélection existante.

Est-ce possible? Comme je comprends "jQuery UI sélectionnable". Il n'y a que "simple clic" avec ou sans CTRL pour ajouter plusieurs, puis le lasso rapide.

J'essaie de voir comment il serait possible de désélectionner un ou deux éléments d'une sélection entière en les cliquant de nouveau. Par exemple, vous faites glisser le lasso et obtenez 30 éléments mais constate que 1 n'a pas besoin de faire partie de cette sélection. Vous cliquez dessus et le désélectionne.

Donc quelque chose qui réagit à la sélection existante et supprime l'élément choisi.

Ou avec le lasso, vous faites une sélection au lasso. Obtient 30 éléments. Ensuite, vous dessinez un nouveau lasso, cette fois-ci en commençant par un élément déjà sélectionné, maintenant il désélectionne par défaut, tout comme le reste du groupe marqué.

Je crois que cela devrait être un comportement personnalisable pour le jQueryUI si quelque chose.

Mais le "simple déselection" est-il possible avec un simple hack jQuery ou demandera-t-il beaucoup de code?

Answer 1

Il semble que je peux et que je devrais modifier Selectable pour le faire moi-même.

J'ai trouvé cet exemple par Nicolas Rudas (?): http://nicolas.rudas.info/jquery/selectables_sortables/

$(function() { 
     $("#selectable") 
      .selectable({ 
       autoRefresh: false, 
       stop: function(e,ui){ 
        $(this).selectable('refresh'); 
       }, 
       noConflict : false 
      }) 
      .sortable({ 
       opacity:'0.5', 
       cursor: 'move', 
       zIndex: 5, 
       helper : 'clone', 
       forcePlaceholderSize : true, 
       stop : function(){ 
        $("#selectable").selectable('refresh'); 
       } 
      }) 


     $('#noConflict').toggle(function() { 
      $(this).text('Disable \'noCoflict\''); 
      $("#selectable").selectable('option','noConflict',true).selectable('refresh'); 
     }, 
     function() { 
      $(this).text('Enable \'noCoflict\''); 
      $("#selectable").selectable('option','noConflict',false).selectable('refresh'); 


     }); 

    }); 

Il montre comment il a permis à la fonction que nous recherchions. Il décrit également certains problèmes qu'il résout aussi. J'examinerai de plus près son code maintenant.

Je termine donc cette question.