Implementar múltiples selecciona con jQuery UI seleccionable

Question

ayuda ¿alguien puede usar la biblioteca seleccionable el jQuery UI para realizar las siguientes funciones:

• Permitir a un usuario seleccionar varios elementos con un clic del ratón
• De-seleccionar un elemento si ya se ha seleccionado con un clic del ratón

Answer 1

Esto se trabajó en torno a otra pregunta , pero estoy aquí para volver a colocar cualquier persona que encuentre esto a través de google. Si se unen el evento "mousedown" en jQuery y conjunto metakey allí (como si el usuario está sosteniendo la tecla CTRL / CMD), a continuación, cuando se llama seleccionable, ya se habrá establecido.

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

Answer 2

No usa seleccionable pero esto le dará el comportamiento que desea con la configuración que ya tiene:

en lugar de

$( "#selectable" ).selectable()

try

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

Answer 3

Ha comprobado la página de demostración para seleccionable ? Ya se puede hacer esto. Para seleccionar varios elementos, simplemente control de retención. Esto es similar a como lo haría trabajar con archivos. Está utilizando la tecla "Ctrl + Clic" no es suficiente?

Código de demostración aquí:

<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

Tome un vistazo a mi respuesta en este hilo.

jQuery UI seleccionable - hacer selección múltiple por defecto

Incluye la sustitución de códigos completa para el js ui seleccionables, así como esbozar los cambios necesarios, haciendo de esta una opción que se puede pasar.

Answer 5

utilizar este código puede ser ot le ayuda

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

si está utilizando el seleccionable en la mesa para td es el uso seleccionable ( 'filtro: td') else

uso seleccionable ()