Saltar al contenido

bootstrap multiselect: anule la selección / desmarque todas las opciones con un solo clic

Solución:

Puedes usar .multiselect('refresh') método como se menciona en el bootstrap-multiselect documentación aquí.

Por lo tanto, agregue un botón / icono HTML junto a la lista de selección de selección múltiple y luego use el siguiente código:

$("#reset_client").click(function(){
  $('option', $('#select_client')).each(function(element) {
    $(this).removeAttr('selected').prop('selected', false);
  });
  $("#select_client").multiselect('refresh');
});
<select name="clients[]" multiple="multiple" id="select_client" style="display: none;">
    <option value="multiselect-all"> Select all</option>
    <option value="1">Client 1</option>
    <option value="2">Client 2</option>
    <option value="3">Client 3</option>
    <option selected="selected" value="4">Client 4</option>
    <option selected="selected" value="5">Client 5</option>
    <option value="6">Client 6</option>
    <option selected="selected" value="7">Client 7</option>
    <option value="8">Client 8</option>
</select>

<input type="button" value="Reset" name="reset_clients" id="reset_client" class="reset_button" title="Clear Selection">

Puede incluir un botón “seleccionar todo”, si lo presiona dos veces, “anulará la selección de todo”. Para hacer esto, agregue esta opción:

includeSelectAllOption:true

Esto desmarcará todo para una selección múltiple de arranque basada en un elemento seleccionado.

function multiselect_deselectAll($el) {
    $('option', $el).each(function(element) {
        $el.multiselect('deselect', $(this).val());
    });
}

$('.multiselect').each(function() {
    var select = $(this);
    multiselect_deselectAll(select);
});

Puede agregar una opción a mano que diga “Seleccionar todo” y luego, cuando se presiona, llame a la función de reinicio.

Ver: https://github.com/davidstutz/bootstrap-multiselect/issues/271

Utilice el siguiente código para anular la selección de todos los elementos seleccionados en el menú desplegable de arranque de selección múltiple

$("#ddlMultiSelectId").multiselect('clearSelection');
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *