jQueryUI sélection multiple par défaut et lasso bascule état sélectionné

Question

J'essaie d'implémenter une table de type tableau comparatif, et une grande liste d'objets sélectionnables fonctionnerait parfaitement, sauf quelques changements de fonctionnalité dont j'ai besoin. Je vois que ces deux questions ont déjà été abordées dans des questions précédentes, mais aucune d'elles ne fournit de solutions complètes.

This question a adressé le comportement de sélection multiple par défaut, mais dit seulement «Je l'ai fait par moi-même» sans fournir quoi que ce soit. En regardant les internes de selectable, je vois que si je joue avec la condition! Event.metaKey, je pourrais probablement obtenir le comportement que je cherche sans trop de problèmes, mais je me demandais si quelqu'un avait une solution qui n'implique pas d'édition les internes.

De même, this page adresse l'effet de bascule lasso que je désirais, mais je ne sais pas où dans le code la fonctionnalité lasso a été modifiée et comme le reste du script (la fonctionnalité sortable) ne fonctionne pas en chrome ou IE8 (link) et est dépassé sur ce point, je préfère ne pas compter sur l'ensemble de la chose.

Donc si quelqu'un pouvait m'aider avec l'un ou l'autre, je l'apprécierais. Merci

[Modifier] Mise en forme ...

Answer 1

Je suis sûr qu'il ya une meilleure façon de faire, mais voici ce que je l'ai fait dans le fichier js sélectionnable.

Pour toujours multi-sélection:

J'ai ajouté une option 'alwaysMulti' (par défaut false). Puis j'ai remplacé les trois instances de !event.metaKey par (!event.metaKey && !options.alwaysMulti) et les deux instances de event.metaKey par (event.metaKey || options.alwaysMulti).

Pour obtenir la sélection lasso pour basculer l'état sélectionné, j'ai trouvé les changements dont j'avais besoin à partir de la deuxième page à laquelle je me suis connecté. J'ai également ajouté une option 'lassoToggle' (false par défaut) pour déclencher cette fonctionnalité. Au sein _mouseDrag, il y a une condition if (hit), il se change à ce qui suit:

if (hit) { 
       // SELECT 
       selectee.deselect = false; 
       if (selectee.selected || (options.lassoToggle && (selectee.startselected && event.metaKey)) { 
        selectee.$element.removeClass('ui-selected'); 
        selectee.selected = false; 
        selectee.deselect = true; 
       } 
       if (selectee.unselecting) { 
        selectee.$element.removeClass('ui-unselecting'); 
        selectee.unselecting = false; 
       } 
       if (!selectee.selecting && (!options.lassoToggle || !selectee.deselect) { 
        selectee.$element.addClass('ui-selecting'); 
        selectee.selecting = true; 
        // selectable SELECTING callback 
        self._trigger("selecting", event, { 
         selecting: selectee.element 
        }); 
       } 
       if(selectee.deselect && options.lassoToggle) { 
        selectee.$element.removeClass('ui-selecting'); 
        selectee.selecting = false; 
        selectee.$element.addClass('ui-unselecting'); 
        selectee.unselecting = true; 
        // selectable UNSELECTING callback 
        self._trigger("unselecting", event, { 
         unselecting: selectee.element 
        }); 
       } 
      } 

Note: Le changement de event.metaKey pour le n'est pas multi-sélection dans cet échantillon de code.

J'espère que cela aide quelqu'un d'autre!