Select2 zeigt keinen ausgewählten Wert

Question

Select2 lädt alle Elemente aus meiner Liste erfolgreich, das Problem, das ich beim Versuch, einen bestimmten Wert beim Laden der Seite auszuwählen, gefunden habe. Beispiel:

:: setzen Sie select2 in ein bestimmtes html-Element, kein Wert ist ausgewählt, auch wenn alle Elemente geladen sind.

$('#my_id').select2(); 

:: Wenn die Seite geladen wird Ich versuche, ein bestimmtes Element ausgewählt zu zeigen, aber nicht wie erwartet funktioniert, denn selbst ausgewählt, wird der select2 es nicht zeigen.

$('#my_id').val('3'); //select the right option, but doesn't render it on page loads. 

Wie kann eine ausgewählte Option beim Laden von Seiten aufgerufen werden?

Vielen Dank im Voraus.

AKTUALISIERT

:: Wie ich alle select2 Artikel laden (sorry, seine Jade, nicht reine HTML):

label(for='category') Category 
    span.required * 
select(id='category', style='width:230px', name='category') 
    option(value='') - Select - 
    each cat in categories 
     option(value='#{cat.id}') #{cat.description} 

P. S .: Alle Artikel aus meiner Liste geladen werden.

:: Wie ich initialisieren select2:

Einfach die folgende Zeile Code auf meinem Javascript und es tut erfolgreich:

$('#category').select2(); 

:: Wie ich versuche, einen bestimmten Wert zu wählen:

• Erster Versuch:

  $('#category').select2(
      { 
       initSelection: function(element, callback) { 
        callback($('#field-category').val()); 
       } 
      } 
  ); 
  

• Zweiter Versuch:

  $('#category').val($('#field-category').val()); 
  

P. S .: #field-category einen Wert sein ein verstecktes Eingabefeld hat und OK funktioniert.

Danke, Jungs!

Answer 1

Sie müssen die Option initSelection verwenden, um den Anfangswert festzulegen.

Wenn Sie eine vordefinierte select Element mit dem select2 zu erstellen, können Sie die folgende Methode

$('select').select2().select2('val','3') 

Demo verwenden: Fiddle

Answer 2

Hier ist, wie val in select2 machen nur die wählen entsprechendes Element. Aus irgendeinem Grund bietet select2 keine Funktion zum Suchen von Auswahlen nach ID.

init:

$("#thing").select2({data:sources, initSelection: function(item, callback) { 
    // despite select2 having already read the whole sources list when you 
    // do .val(n) you have to explicitly tell it how to find that item again. 
    var to_be_selected = null; 
    $.each(sources, function(index, thing) { 
    if (thing.id == item.val()) { 
     to_be_selected = thing; 
     return; 
    } 
    }) 
    callback(to_be_selected); 
}}) 

normalen Code

// to load the thing with id==3 from the initial sources list. 
$("#thing").select2({'val': 3}) 

Answer 3

einen Trigger Änderung abgeben val Einstellung:

$('#my_id').val('3').trigger('change');