webentwicklung-frage-antwort-db.com.de

JQuery select2 Standardwert aus einer Option in der Liste setzen?

Ich möchte in der Lage sein, den Standardwert/den ausgewählten Wert eines select-Elements mithilfe des JQuery Select2-Plugins festzulegen.

47
user857276

Eine weitere Möglichkeit - fügen Sie einfach ein selected = "selected"-Attribut zum select-Markup hinzu und rufen Sie select2 auf. Es muss Ihren ausgewählten Wert annehmen. Keine Notwendigkeit für zusätzliches JavaScript. So was :

Markup 

<select class="select2">
   <option id="foo">Some Text</option>
   <option id="bar" selected="selected">Other Text</option>
</select>

JavaScript

$('select').select2(); //oh yes just this!

Siehe Geige: http://jsfiddle.net/6hZFU/

Edit: (Danke, Jay Haase!) 

Wenn dies nicht funktioniert, setzen Sie die val-Eigenschaft von select2 auf null, um den Wert wie folgt zu löschen:

$('select').select2("val", null); //a lil' bit more :)

Danach ist es einfach genug, val auf "Whatever You Want" zu setzen.

47
krishgopinath

Eine Möglichkeit, dies zu erreichen, ist ...

$('select').select2().select2('val', $('.select2 option:eq(1)').val());

Grundsätzlich initialisieren Sie zunächst das Plugin und geben dann den Standardwert mit dem Parameter 'val' an. Der tatsächliche Wert wird von der angegebenen Option übernommen, in diesem Fall # 1. Der in diesem Beispiel ausgewählte Wert wäre "bar".

<select class=".select2">
  <option id="foo">Some Text</option>
  <option id="bar">Other Text</option>
</select>

Hoffe, das ist jemand anderem nützlich.

22
user857276
$("#id").select2("val", null); //this will not work..you can try

Sie sollten dies tatsächlich tun ... einleiten und dann den Wert festlegen. Nun, dies ist auch die Art und Weise, wie es für mich funktioniert hat.

$("#id").select2().select2("val", null);
$("#id").select2().select2("val", 'oneofthevaluehere');
22
rajesh_kw

Die obigen Lösungen funktionierten nicht für mich, aber dieser Code von Select2s eigener Website hat Folgendes getan:

$('select').val('US'); // Select the option with a value of 'US'
$('select').trigger('change'); // Notify any JS components that the value changed

Webseite hier gefunden

Ich hoffe, das hilft allen, die so kämpfen wie ich.

11
avebone

Für 4.x Version 

$('#select2Id').val(__INDEX__).trigger('change');

wert auswählen mitINDEX

$('#select2Id').val('').trigger('change');

nichts auswählen (Platzhalter anzeigen, falls vorhanden) 

5
Wishmaster

Kam aus der Zukunft? Suchen Sie nach dem Standardwert für die Ajax-Quelle?

// Set up the Select2 control
$('#mySelect2').select2({
    ajax: {
        url: '/api/students'
    }
});

// Fetch the preselected item, and add to the control
var studentSelect = $('#mySelect2');
$.ajax({
    type: 'GET',
    url: '/api/students/s/' + studentId
}).then(function (data) {
    // create the option and append to Select2
    var option = new Option(data.full_name, data.id, true, true);
    studentSelect.append(option).trigger('change');

    // manually trigger the `select2:select` event
    studentSelect.trigger({
        type: 'select2:select',
        params: {
            data: data
        }
    });
});

Bitte.

Referenz: https://select2.org/programmatic-control/add-select-clear-items#preselecting-options-in-remotely-sourced-ajax-select2

1
Brain90

Ich weiß nicht, dass andere Probleme haben. Nur dieser Code hat für mich funktioniert.

$('select').val('').select2();
0
Fahad Bhuyian