Implementare più seleziona con jQuery UI selezionabile

Question

Qualcuno può aiutarmi usare biblioteca selezionabile il jQuery UI per eseguire le seguenti funzioni:

• Consentire a un utente di selezionare più elementi con un clic del mouse
• De-selezionare una voce se è già selezionato con un clic del mouse

Answer 1

Questa è aggirato nel un'altra domanda , ma sto qui per reinserire chi trova questo tramite Google. Se si associa l'evento "MouseDown" in jQuery e metakey set lì (come se l'utente sta tenendo il tasto CTRL / cmd), poi quando si chiama selezionabili, sarà già impostata.

$(".YOUR_SELECTOR_HERE").bind("mousedown", function(e) {
  e.metaKey = true;
}).selectable();

Answer 2

Non fa uso selezionabile, ma questo ti porterà il comportamento desiderato con l'impostazione già avete:

anziché

$( "#selectable" ).selectable()

try

$(".ui-widget-content").click( function() {
    $(this).toggleClass("ui-selected");
});

Answer 3

Hai controllato la href="http://jqueryui.com/demos/selectable/" rel="nofollow"> ? Si può già fare questo. Per selezionare più elementi, solo il controllo attesa. Questo è simile a come si dovrebbe lavorare con i file. Sta usando "Ctrl + Click" non abbastanza?

Codice demo qui:

<style>
    #feedback { font-size: 1.4em; }
    #selectable .ui-selecting { background: #FECA40; }
    #selectable .ui-selected { background: #F39814; color: white; }
    #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
    #selectable li { margin: 3px; padding: 0.4em; font-size: 1.4em; height: 18px; }
    </style>
    <script>
    $(function() {
        $( "#selectable" ).selectable();
    });
    </script>

<div class="demo">

<ol id="selectable">
    <li class="ui-widget-content">Item 1</li>
    <li class="ui-widget-content">Item 2</li>
    <li class="ui-widget-content">Item 3</li>
    <li class="ui-widget-content">Item 4</li>
    <li class="ui-widget-content">Item 5</li>
    <li class="ui-widget-content">Item 6</li>
    <li class="ui-widget-content">Item 7</li>
</ol>

</div>

Answer 4

Date un'occhiata alla mia risposta su questo thread.

jQuery UI selezionabile - rendendo selezione multipla predefinita

Esso comprende la sostituzione codice completo per i js ui selezionabili, nonché delineare le modifiche necessarie, rendendo questa una scelta che può essere passato.

Answer 5

utilizzare questo codice può essere ot ti aiuta

  $('#selectable').bind("mousedown", function (e) {
      e.metaKey = true;    
 }).selectable('filter : td')​

se si utilizza la selezionabile sul tavolo per td è l'uso selezionabile ( 'filtro: td') else

uso selezionabile ()