Cambiar el valor del cuadro de selección de Chosen.js usando jQuery

Question

Estoy intentando cambiar el valor de mi cuadro de selección que tiene Chosen.js superposición. La idea es cambiar el valor seleccionado cuando el usuario hace clic en un botón.

Con cuadro de selección normal que puede cambiar el valor haciendo:

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

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

Pero con Chosen.js no funciona anymore..I han intentado algunas cosas pero nada ha funcionado. ¿Alguna idea de cómo hacer que funcione?

Fiddle

Answer 1

Así que después de la publicación de esta pregunta continué tratando de resolver este problema y pasó a encontrado una manera de hacer esto.

$('#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"); 
}); 

La clave fue poner .chosen() antes de .Cambiar() y luego desencadenar "Liszt: actualización". Funciona, pero no sé si esta es la mejor manera de hacer esto ..

Si usted tiene una mejor manera de hacer esto, por favor hágamelo saber

Answer 2

me encontré con este tratando de averiguarlo mí mismo.

que era capaz de hacerlo con una combinación de cambio del índice seleccionado en el campo original, y luego activa el evento liszt:updated en ese campo:

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

Answer 3

Con el plugin Chosen.js funciona.

var myIndex = 4; 

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

Answer 4

Apenas una actualización (He encontrado esta página de Google, tal vez otras personas encontrarán también)

He tryed para comentar la respuesta de @ splitz pero no podía porque todavía don' t tiene suficiente reputación.

La nueva manera de hacerlo es:

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

Ahora, el truco es el "elegido: actualización".

respuesta Actualizado encontrado en: Changing selection in a select with the Chosen plugin