Ich verwende das Bootstrap-Select- Plugin wie folgt:
HTML :
<select name="selValue" class="selectpicker">
<option value="1">Val 1</option>
<option value="2">Val 2</option>
<option value="3">Val 3</option>
<option value="4">Val 4</option>
</select>
Javascript :
$('select[name=selValue]').selectpicker();
Jetzt möchte ich den ausgewählten Wert auf diese Auswahl setzen, wenn auf die Schaltfläche geklickt wird ... so etwas:
$('#mybutton').click(function(){
$('select[name=selValue]').val(1);
});
Aber nichts passiert.
Wie kann ich das erreichen?
Antworten:
Der Wert ist korrekt ausgewählt, aber Sie haben ihn nicht gesehen, da das Plugin die tatsächliche Auswahl ausblendet und eine Schaltfläche mit einer ungeordneten Liste anzeigt. Wenn Sie also möchten, dass der Benutzer den ausgewählten Wert auf der Auswahl sieht, können Sie Folgendes tun ::
Bearbeiten:
Wie @blushrt betont, ist eine bessere Lösung:
Bearbeiten 2:
Übergeben Sie die Werte als Array, um mehrere Werte auszuwählen.
quelle
$('select[name=selValue]').val(1);$('.selectpicker').selectpicker('refresh');
diese Weise ändern Sie nur die versteckte Auswahl, indem Sie durch Auswahl von Auswahlauswahl ('Aktualisieren') die Schaltfläche neu zeichnen.Das ist alles was Sie tun müssen. Sie müssen das generierte HTML von selectpicker nicht direkt ändern, sondern nur das ausgeblendete Auswahlfeld ändern und dann den selectpicker aufrufen ('refresh').
quelle
$('.selectpicker').selectpicker('refresh');
kann Ihre Leistung töten, wenn Sie viele ausgewählte Picker auf einer Seite habenquelle
Es ist keine Aktualisierung erforderlich, wenn der Parameter "val" zum Einstellen des Werts verwendet wird, siehe Geige . Verwenden Sie Klammern für den Wert, um mehrere ausgewählte Werte zu aktivieren.
quelle
Das hat bei mir funktioniert.
quelle
Eigentlich ist Ihr Wert eingestellt, aber Ihr Selectpicker wird nicht aktualisiert
Wie Sie der Dokumentation
https://silviomoreto.github.io/bootstrap-select/methods/#selectpickerval entnehmen können
Der richtige Weg wäre dies
Für mehrere Werte können Sie ein Array von Werten hinzufügen
quelle
Sie können den ausgewählten Wert festlegen, indem Sie die val-Methode für das Element aufrufen.
Dadurch werden alle Elemente in einer Mehrfachauswahl ausgewählt.
Details finden Sie vor Ort: https://silviomoreto.github.io/bootstrap-select/methods/
quelle
$('selector').selectpicker('val',value);
Anstelle des Selektors können Sie dem Selektor entweder eine Klasse oder eine ID geben, zum Beispiel:
$('#mySelect').selectpicker('val',your_value)
quelle
quelle
Eine leichte Variation von blushrt Antwort, wenn Sie keine "fest codierten" Werte für Optionen haben (dh 1, 2, 3, 4 usw.)
Angenommen, Sie rendern a
<select>
mit Optionswerten als GUIDs einiger Benutzer. Dann müssen Sie den Wert der Option irgendwie extrahieren, um sie auf dem zu setzen<select>
.Im Folgenden wählen wir die erste Option der Auswahl.
HTML :
Javascript :
Wir haben dies in einer Auswahl mit dem Schlüsselwort multiple verwendet
<select multiple>
. In diesem Fall ist standardmäßig nichts ausgewählt, aber wir wollten, dass immer das erste Element ausgewählt wird.quelle
Basierend auf der großartigen Antwort von @blushrt werde ich diese Antwort aktualisieren. Nur mit -
funktioniert, wenn Sie alles, was Sie brauchen, in den Selektor vorinstalliert haben.
quelle
quelle
Die '0' ist der Wert des Elements, das Sie auswählen möchten
quelle
Eine andere Möglichkeit besteht darin, mit diesem Schlüsselwort einfach das Objekt darin abzurufen und seinen Wert zu bearbeiten. Z.B :
quelle
Sie können dies auch einfach als mehrwertig bezeichnen
$(<your select picker>).selectpicker("val", ["value1", "value2"])
Weitere Informationen finden Sie hier https://developer.snapappointments.com/bootstrap-select/methods/
quelle
Setzen Sie einfach die Option: ausgewählt, um den Wert zu erhalten, da sich der Bootstrap-Auswahlpicker in ändert und auf andere Weise angezeigt wird. Aber wählen Sie noch dort ausgewählt
quelle
Benutzer-ID Für Element also
quelle
Verwenden Sie dies und es wird funktionieren:
quelle