Thay đổi giá trị của hộp chọn Chosen.js bằng cách sử dụng jQuery

Question

Tôi đang cố gắng thay đổi giá trị của hộp chọn của tôi có lớp phủ Chosen.js. Ý tưởng là thay đổi giá trị đã chọn khi người dùng nhấp vào nút.

Với hộp lựa chọn thường xuyên Tôi có thể thay đổi giá trị bằng cách làm:

$('#GroupsShowNext').unbind("click").click(function() { 
    var index = $("#GroupsViewGroups").prop("selectedIndex"); 
    index += 1; 

    $('#GroupsViewGroups option').eq(index).attr('selected', 'selected'); 
    $('#GroupsViewGroups').change(); 
}); 

Nhưng với Chosen.js nó không hoạt động anymore..I đã cố gắng vài điều nhưng không có tác dụng. Bất kỳ ý tưởng làm thế nào để làm cho nó hoạt động?

Fiddle

Answer 1

Vì vậy, sau khi đăng câu hỏi này, tôi tiếp tục cố gắng giải quyết vấn đề này và đã xảy ra với phát hiện ra một cách để làm điều này.

$('#GroupsShowNext').unbind("click").click(function() { 
    var index = $("#GroupsViewGroups").prop("selectedIndex"); 
    index += 1; 
    $('#GroupsViewGroups option').eq(index).attr('selected', 'selected'); 
    $('#GroupsViewGroups').chosen().change(); 
    $("#GroupsViewGroups").trigger("liszt:updated"); 
}); 

Điều quan trọng là đặt .chosen() trước .change() và sau đó kích hoạt "liszt: updated". Nó hoạt động nhưng tôi không biết nếu điều này là cách tốt nhất để làm điều này ..

Nếu bạn có một cách tốt hơn để làm điều này, xin vui lòng cho tôi biết

Answer 2

tôi stumbled trên này cố gắng tìm nó ra riêng tôi.

tôi đã có thể làm điều đó với một sự kết hợp của việc thay đổi các chỉ số được lựa chọn trên các lĩnh vực ban đầu, và sau đó kích hoạt các sự kiện liszt:updated trên sân rằng:

$('#GroupsViewGroups')[0].selectedIndex = $('#GroupsViewGroups')[0].selectedIndex + 1; 
$('#GroupsViewGroups').trigger('liszt:updated'); 

Answer 3

Với plugin Chosen.js nó hoạt động.

var myIndex = 4; 

$("select#GroupsViewGroups").prop('selectedIndex', myIndex); 

Answer 4

Chỉ cần một bản cập nhật (Tôi tìm thấy trang này từ google, có lẽ người khác sẽ tìm thấy nó cũng)

Tôi đã tryed nhận xét câu trả lời của @ splitz nhưng tôi có thể không phải vì tôi vẫn don' t có đủ danh tiếng.

Cách mới để làm điều đó là:

$('#GroupsShowNext').unbind("click").click(function() { 
    var index = $("#GroupsViewGroups").prop("selectedIndex"); 
    index += 1; 
    $('#GroupsViewGroups option').eq(index).attr('selected', 'selected'); 
    $("#GroupsViewGroups").trigger("chosen:updated"); 
}); 

Bây giờ, các trick là "lựa chọn: cập nhật".

câu trả lời Cập nhật tìm thấy trên: Changing selection in a select with the Chosen plugin