JQuery select2 ustawić domyślną wartość z opcji na liście?

Question

Chcę móc ustawić domyślną/wybraną wartość wybranego elementu za pomocą wtyczki JQuery Select2.

Answer 1

Jednym ze sposobów osiągnięcia tego celu jest ...

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

Więc w zasadzie najpierw initalize plugin następnie określić wartość domyślną za pomocą parametru „val”. Rzeczywista wartość jest pobierana z określonej opcji, w tym przypadku nr 1. Tak więc wybrana wartość z tego przykładu będzie "bar".

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

Mam nadzieję, że jest to przydatne dla kogoś innego.

Answer 2

Jeszcze jeden sposób - wystarczy dodać atrybut selected = "selected" do znacznika select i zadzwonić pod numer select2. Musi wziąć wybraną przez ciebie wartość. Nie potrzeba dodatkowego JavaScriptu. Tak:

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! 

Zobacz skrzypce: http://jsfiddle.net/6hZFU/

Edycja: (! Dzięki, Jay Haase)

Jeśli to nie zadziała, spróbuj ustawić właściwość select2val do null, aby usunąć wartość, podobnie jak to:

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

po tym, że jest na tyle prosty, aby ustawić val do "Whatever You Want".

Answer 3

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

Trzeba rzeczywiście to zrobić ... intialise a następnie ustawić value..well Jest to również sposób, w jaki pracował dla mnie.

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

Answer 4

Dla ajax select2 wybierz kilka rozwijanych, które mi się podobają;

//preset element values 
    //topics is an array of format [{"id":"","text":""}, .....] 
     $(id).val(topics); 
      setTimeout(function(){ 
      ajaxTopicDropdown(id, 
       2,location.origin+"/api for gettings topics/", 
       "Pick a topic", true, 5);      
      },1); 
     // ajaxtopicDropdown is dry fucntion to get topics for diffrent element and url 

Answer 5

$('select').select2("val",null); 

Answer 6

powyższych rozwiązań nie działa dla mnie, ale ten kod z własnej stronie internetowej select2 za zrobił:

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

Webpage found here

Nadzieja pomaga to dla każdego, kto ma problemy, jak Byłam.

Answer 7

Jeśli używasz źródła danych tablicy można zrobić coś jak poniżej -

$(".select").select2({ 
    data: data_names 
}); 
data_names.forEach(function(name) { 
    if (name.selected) { 
     $(".select").select2('val', name.id); 
    } 
}); 

ta zakłada, że ​​z danych ustawić jeden element, który chcesz ustawić jako domyślny posiada dodatkowy atrybut o nazwie wybranego i używamy go do ustawienia wartości.

Answer 8

Dla 4.x wersji

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

aby wybrać wartość z INDEX

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

wybrać nic (pokaz zastępczy jeśli jest)