Thay đổi lựa chọn trong một lựa chọn với plugin được chọn

Question

Tôi đang cố gắng thay đổi tùy chọn hiện được chọn trong một lựa chọn với plugin Đã chọn.

documentation bao gồm việc cập nhật danh sách và kích hoạt sự kiện khi tùy chọn được chọn, nhưng không có gì (tôi có thể thấy) thay đổi bên ngoài giá trị hiện được chọn.

Tôi đã thực hiện một jsFiddle to demonstrate the code và cách tôi đã cố gắng thay đổi các lựa chọn:

$('button').click(function() { 
    $('select').val(2); 
    $('select').chosen().val(2); 
    $('select').chosen().select(2); 
}); 

Answer 1

Từ "Cập nhật Chosen động" trong docs: Bạn cần phải kích hoạt các 'chọn: cập nhật' sự kiện trên lĩnh vực

$(document).ready(function() { 

    $('select').chosen(); 

    $('button').click(function() { 
     $('select').val(2); 
     $('select').trigger("chosen:updated"); 
    }); 

}); 

Chú ý: các phiên bản trước 1.0 sử dụng như sau:

$('select').trigger("liszt:updated"); 

Answer 2

Câu trả lời của tôi là muộn, nhưng tôi muốn thêm một số thông tin bị mất trong tất cả các câu trả lời ở trên.

1) Nếu bạn muốn chọn giá trị đơn trong lựa chọn đã chọn.

$('#select-id').val("22").trigger('chosen:updated'); 

2) Nếu bạn đang sử dụng nhiều lựa chọn, thì bạn có thể cần đặt nhiều giá trị cùng một lúc.

$('#documents').val(["22", "25", "27"]).trigger('chosen:updated'); 

Thông tin thu thập được từ các liên kết sau đây:
1) Chosen Docs
2) Chosen Github Discussion

Answer 3

Đôi khi bạn phải gỡ bỏ các tùy chọn hiện tại để thao tác các tùy chọn đã chọn.

Dưới đây là một ví dụ làm thế nào để thêm tùy chọn:

<select id="mySelectId"> 
    <option value=""></option> 
    <option value="Argentina">Argentina</option> 
    <option value="Germany">Germany</option> 
    <option value="Greece">Greece</option> 
    <option value="Japan">Japan</option> 
    <option value="Thailand">Thailand</option> 
</select> 

<script> 
    mySelect = $('#mySelectId'); 
    var selected = mySelect.val();       //get current values 
    selected = selected.concat(['Germany','Argentina']); //merge with new values 
    selected = Array.from(new Set(selected));    //make values unique 
    mySelect.val(null);         //delete current options 
    mySelect.val(selected);        //add new options 
    mySelect.trigger('chosen:updated');     //update chosen 
</script>