JQuery select2 đặt giá trị mặc định từ một tùy chọn trong danh sách?

Question

Tôi muốn có thể đặt giá trị mặc định/đã chọn của phần tử chọn bằng cách sử dụng plugin JQuery Select2.

Answer 1

Một cách để thực hiện điều này là ...

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

Vì vậy, về cơ bản bạn đầu tiên initalize các plugin sau đó xác định giá trị mặc định bằng cách sử dụng tham số 'val'. Giá trị thực tế được lấy từ tùy chọn được chỉ định, trong trường hợp này là # 1. Vì vậy, giá trị được chọn từ ví dụ này sẽ là "bar".

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

Hy vọng điều này hữu ích cho người khác.

Answer 2

Một cách khác - chỉ cần thêm thuộc tính selected = "selected" vào đánh dấu select và gọi select2 trên đó. Nó phải lấy giá trị đã chọn của bạn. Không cần thêm JavaScript. Như thế này:

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! 

Xem fiddle: http://jsfiddle.net/6hZFU/

Edit: (! Cảm ơn, Jay Haase)

Nếu điều này không làm việc, hãy thử đặt val tài sản của select2 để null, để xóa các giá trị, như thế này:

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

Sau đó, nó là đủ đơn giản để thiết val-"Whatever You Want".

Answer 3

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

Bạn thực sự nên làm điều này ... intialise và sau đó thiết lập các value..well này cũng là cách nó làm việc cho tôi.

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

Answer 4

Để chọn menu thả xuống ajax select2 tôi đã làm như thế này;

//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

Các giải pháp trên không làm việc cho tôi, nhưng mã này từ trang web của riêng Select2 đã làm:

$('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

Hope this helps cho những ai đang gặp khó khăn, như Tôi đã.

Answer 7

Nếu bạn đang sử dụng một nguồn dữ liệu mảng, bạn có thể làm điều gì đó như dưới đây -

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

này giả định rằng ra khỏi dữ liệu của bạn thiết lập một mục mà bạn muốn thiết lập như mặc định có một thuộc tính bổ sung được gọi chọn và chúng tôi sử dụng điều đó để đặt giá trị.

Answer 8

Đối 4.x phiên bản

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

để chọn giá trị với INDEX

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

để chọn gì (hiển thị giữ chỗ nếu nó là)