Wie setze ich den Platzhalter auf den Wert, der durch select2 zurückgesetzt wird? In meinem Beispiel Wenn Standorte oder Notenauswahlfelder angeklickt werden und mein select2 einen Wert hat, sollte der Wert von select2 zurückgesetzt und der Standardplatzhalter angezeigt werden. Dieses Skript setzt den Wert zurück, zeigt jedoch keinen Platzhalter an
$("#locations, #grade ").change(function() {
$('#e6').select2('data', {
placeholder: "Studiengang wählen",
id: null,
text: ''
});
});
$("#e6").select2({
placeholder: "Studiengang wählen",
width: 'resolve',
id: function(e) {
return e.subject;
},
minimumInputLength: 2,
ajax: {
url: "index.php?option=com_unis&task=search.locator&tmpl=component&<?php echo JSession::getFormToken() ?>=1",
dataType: 'json',
data: function(term, page) {
return {
q: term, // search term
g: $('#grade option:selected').val(),
o: $('#locations option:selected').val()
};
},
results: function(data, page) {
return {
results: data
};
}
},
formatResult: subjectFormatResult,
formatSelection: subjectFormatSelection,
dropdownCssClass: "bigdrop",
escapeMarkup: function(m) {
return m;
}
});
.select2("val", "")
funktionieren.$("#customers_select").val('').trigger('change') ;
Ich habe das benutzt und es hat funktioniert.Select2 hat seine API geändert:
Der beste Weg, dies jetzt zu tun, ist:
Bearbeiten: Dezember 2016 Kommentare deuten darauf hin, dass das Folgende die aktualisierte Methode ist, um dies zu tun:
quelle
$('#your_select_input').val('').trigger('change')
change
Trigger-Zusatz, löst aber auch die von uns verwendete Validierungsbibliothek aus - für den Moment muss ich die veraltete Version verwenden.Die akzeptierte Antwort funktioniert in meinem Fall nicht. Ich versuche das und es funktioniert:
Definieren Sie select2:
oder
Zurücksetzen:
oder
quelle
$('#your_select_input').val('').trigger('change')
noch$('#your_select_input').val('');
funktioniert nicht in FirefoxDas einzige, was für mich funktionieren kann, ist:
Ich benutze Version 4.0.3
Referenz
Laut Select2-Dokumentation
quelle
$('select2element').val("").trigger("change")
funktioniert auch gut.Mit Select2 Version 4.0.9 funktioniert dies für mich:
quelle
Select2 verwendet eine bestimmte CSS-Klasse. Eine einfache Möglichkeit zum Zurücksetzen ist:
Und Sie haben den Vorteil, dass wenn Sie mehrere Select2 in derselben Form haben, alle mit diesem einzigen Befehl zurückgesetzt werden.
quelle
Benutze das :
quelle
AUSGEWÄHLTEN WERT ENTFERNEN
OPTIONSWERTE LÖSCHEN
quelle
Ich weiß, dass dies eine alte Frage ist, aber dies funktioniert für die select2-Version 4.0
oder
wenn Sie Änderungsereignisse daran gebunden haben
quelle
$('#select2-element').last().val('').trigger('change.select2');
Verwenden Sie Folgendes, um select2 zu konfigurieren
Und um die Eingabe programmgesteuert zu löschen
quelle
Das ist der richtige Weg:
Ich verwende die neueste Version von Select2.
quelle
Zunächst müssen Sie select2 folgendermaßen definieren:
Zum Zurücksetzen von select2 können Sie einfach den folgenden Codeblock verwenden:
quelle
Sie können die Auswahl durch löschen
Aber es wird Sie nicht zurück zu Ihrem Platzhalter bringen.
Es ist also eine halbe Lösung
quelle
Ich habe die oben genannten Lösungen ausprobiert, aber es hat bei mir nicht funktioniert.
Dies ist eine Art Hack, bei dem Sie keine Änderung auslösen müssen.
oder
quelle
Für Anwender , Datenfern Laden, dies wird den select2 auf den Platzhalter zurücksetzen , ohne Ajax abzufeuern. Funktioniert mit v4.0.3:
quelle
Um das Formular zurückzusetzen, haben einige von Ihnen eine Schaltfläche zum Zurücksetzen. Fügen Sie den folgenden Code in das Skript-Tag ein
Oder einfach das Auswahlfeld leeren, ohne einen Platzhalter zu behalten:
quelle
Für den Platzhalter
So setzen Sie eine Auswahl zurück 2
Hoffe das hilft
quelle
Befolgen Sie die empfohlene Vorgehensweise. Gefunden in der Dokumentation https://select2.github.io/options.html#my-first-option-is-being-displayed-instead-of-my-placeholder (dies scheint ein ziemlich häufiges Problem zu sein):
Wenn dies passiert, bedeutet dies normalerweise, dass Sie kein Leerzeichen haben
<option></option>
als erste Option in Ihrem haben<select>
.wie in:
quelle
Ich hatte auch dieses Problem und es ist darauf zurückzuführen
val(null).trigger("change");
, dass einNo select2/compat/inputData
Fehler ausgegeben wurde, bevor der Platzhalter zurückgesetzt wird. Ich habe es gelöst, indem ich den Fehler abgefangen und den Platzhalter direkt (zusammen mit einer Breite) gesetzt habe. Hinweis: Wenn Sie mehr als eine haben, müssen Sie jede fangen.Ich verwende Select2 4.0.3
quelle
change
Ereignis gebunden ist . Versuchen Sie es mit Auslösenchange.select2
- das löst keine gebundenen Listener aus (siehe github.com/select2/select2/issues/3620 ).ab v.4.0.x ...
um die Werte zu löschen, aber auch die Platzhalternutzung wiederherzustellen ...
Wenn es leer ist, wird stattdessen das erste Optionselement ausgewählt, das möglicherweise nicht Ihren Wünschen entspricht
Ehrlich gesagt ... Select2 ist so ein Schmerz im Hintern, es wundert mich, dass es nicht ersetzt wurde.
quelle
Ich habe die oben genannten Lösungen ausprobiert, aber keine hat mit Version 4x funktioniert.
Was ich erreichen möchte, ist: Alle Optionen löschen, aber den Platzhalter nicht berühren. Dieser Code funktioniert für mich.
quelle
Mit select2 Version 3.2 hat das bei mir funktioniert:
Musste nicht implementieren
initSelection
quelle
Nachdem ich die ersten 10 Lösungen hier ausprobiert hatte und fehlgeschlagen war, fand ich, dass diese Lösung funktioniert (siehe "nilov kommentiert am 7. April • bearbeitet" Kommentar unten auf der Seite):
Die Änderung wird dann vorgenommen:
(Der Autor hat ursprünglich gezeigt
var $select = $(this[1]);
, was ein Kommentator korrigiert hatvar $select = $(this[0]);
, was ich oben zeige.)quelle
Verwenden Sie diesen Code in Ihrer js-Datei
quelle
Bevor Sie den Wert damit löschen
$("#customers_select").select2("val", "");
Option versuchen Fokus beim Zurücksetzen auf ein anderes Steuerelement zu setzen.Dadurch wird der Platzhalter erneut angezeigt.
quelle
Die DOM-Schnittstelle verfolgt bereits den Ausgangszustand ...
Folgendes ist also ausreichend:
quelle
Na wann immer ich es tat
Nach drei bis vier Auslösern bekam ich eine Art Verzögerung. Ich nehme an, es gibt ein Speicherleck. Es ist nicht in meinem Code enthalten, da meine App verzögerungsfrei ist, wenn ich diese Zeile entferne.
Da ich allowClear-Optionen auf true gesetzt habe, habe ich mich für entschieden
Darauf kann ein $ ('myselectdropdown') folgen. Select2 ('close'); Ereignisauslöser für das Element select2 dom, falls Sie das Dropdown-Menü für geöffnete Vorschläge schließen möchten.
quelle
Ein [sehr] hackiger Weg, dies zu tun (ich habe gesehen, dass es für Version 4.0.3 funktioniert):
quelle
Meine Lösung ist:
quelle
Dabei ist 0 Ihr erster Wert in der Dropdown-Liste
quelle