Select2 alle Werte abwählen

Lesezeit: 2 Minuten

Benutzer-Avatar
Janus

Ich möchte alle Werte mit einem Klick abwählen, ohne jeden zu verwenden id getrennt.

Ich habe eine Weile herumgefummelt, aber dieses Abwählen nur des ersten Werts. Irgendwelche Vorschläge?

So versuche ich zu deaktivieren:

$( "#mybutton" ).click(function() {    
   $("select").select2('val', '')
});

http://jsfiddle.net/6hZFU/75/

  • Bitte fügen Sie Code zu einer Frage hinzu, die eine Geige enthält.

    – Rob Schmuecker

    13. September 2013 um 8:59 Uhr

Benutzer-Avatar
Ivan Ivanic

$("select").val('').change();

Das ist alles 🙂
http://jsfiddle.net/6hZFU/78/

Erklärung: Wenn Sie den Wert einer Eingabe ändern oder über JavaScript auswählen, wird der Browser kein Änderungsereignis für diese Änderung auslösen (so sagen es die Spezifikationen).

Wenn Sie das Änderungsereignis auslösen, holt select2 auf und gibt den neuen Wert von select wieder.

  • Ja, denn wenn Sie den Wert einer Eingabe ändern oder über JavaScript auswählen, wird der Browser kein Änderungsereignis für diese Änderung auslösen. Wenn Sie das Änderungsereignis auslösen, holt select2 auf und gibt den neuen Wert von select wieder.

    – Ivan Ivanic

    13. September 2013 um 10:34 Uhr

  • Ihr letzter Kommentar sollte Ihrer Antwort zur Klarstellung hinzugefügt werden. Gute Erklärung.

    – Maxime

    27. Mai 2015 um 13:24 Uhr

Versuchen Sie stattdessen Folgendes:

$('select').select2({
    placeholder: "select me"
});

$("#mybutton").click(function () {
    $("select").each(function () { //added a each loop here
        $(this).select2('val', '')
    });
});

Demo hier

  • @danip, welche Version von select2 verwendest du, viele Änderungen mit 4.0, unten eine neue Antwort hinzugefügt

    – Steve

    12. Juni 2015 um 0:46 Uhr

  • @Steve ja, ich hatte Probleme mit 4.0, aber ich verstehe immer noch nicht, warum die Syntax funktioniert und die Mehrfachauswahl nicht

    – Johnlemon

    12. Juni 2015 um 8:00 Uhr

Wenn Sie Select2 Version 4.0 verwenden, müssen Sie die neue Syntax verwenden:

$("select").val(null).trigger("change");

  • Funktioniert für Version: 3.4.5 Danke 🙂

    – Akash Varlani

    11. Juni 2016 um 6:15 Uhr

Falls sich jemand für die native Konfigurationslösung von Select2 interessiert (keine separate Taste).

Zum Zeitpunkt des Schreibens (select2 v 4) kann Select2 eine Schaltfläche zum Löschen der Mehrfachauswahl hinzufügen. Kein Bedarf für <option></option> Problemumgehung, damit Platzhalter angezeigt werden:

$('#my-select').select2({
    placeholder: "Select something",
    allowClear: true
});

Aus die Dokumentation.

$('#destinatariMail').val("-1").trigger("change");

Auf diese Weise deaktivieren Sie auch markierte Optionen, die “on-the-fly” eingefügt wurden.

Ich habe die oben genannten Lösungen ausprobiert, aber es hat bei mir nicht funktioniert.

Dies ist eine Art Hack, bei dem Sie nicht müssen trigger change.

$("select").select2('destroy').val("").select2();

oder

$("select").each(function () { //added a each loop here
        $(this).select2('destroy').val("").select2();
});

Benutzer-Avatar
Bulzib Rugulus

Wenn Sie das Mehrfachauswahl-Dropdown mit Select2 v4 api löschen möchten, ist hier eine einfache Möglichkeit:

$("li.select2-selection__choice").remove();
$(".select2").each(function() { $(this).val([]); });

Kein Fokus auf Dropdown und beide Elemente „select“ und „Select2“ bereinigen 😉

1226670cookie-checkSelect2 alle Werte abwählen

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy