¿Cómo seleccionar una opción en un jQuery ui selectmenu dinámicamente?

Question

Después de cambiar un menú de una selección normal a un menú de selección de jQuery, ya no puedo seleccionar opciones en él programáticamente. ¿Hay alguna forma de hacer esto?

El código para seleccionar es (suponiendo ListId es el ID real de la lista)

$('#ListId').val(value); 

El plugin se activited así:

$("#ListId").selectmenu({ style: "dropdown", width:140 }); 

¿Hay una manera de seleccionar un elemento en el menú de selección? Llamar a la misma función .val (valor) solo selecciona el valor en la lista de selección original oculta, no el menú de selección jQuery muy bien diseñado.

Answer 1

$('#ListId').selectmenu("value", value); 

Answer 2

Se podría provocar, además, el controlador de eventos de cambio mediante la adición de una llamada cambio:

$('#ListId').selectmenu("value", value); 
$('#ListId').selectmenu("change"); // Add this for a change event to occur 

Answer 3

Tenga en cuenta que debe utilizar índices (no valores) para seleccionar la opción de utilizar este método.

Por ejemplo, dado esto seleccione.

<select id="ListId"> 
    <option value="value-one">One</option> 
    <option value="value-two">Two</option> 
</select> 

En este caso la expresión $('#ListId').selectmenu("value", "value-two"); no volvería ningún resultado. En lugar de eso, tenemos que usar $('#ListId').selectmenu("value", "2");. En otras palabras, tenemos que usar la posición/índice del elemento dentro de la selección. ¡No es el valor!

Sin embargo, es fácil encontrar el índice. Puedes usar la siguiente línea para lograrlo.

var index = $('#ListID option[value="value-two"]').index(); 
$('#ListId').selectmenu("value", index); 

Answer 4

Suponiendo que ya ha hecho esta parte una vez antes:

$("#ListId").selectmenu({ style: "dropdown", width:140 }); 

he encontrado que esto funciona:

$('#ListId').val(value); 
$('#ListId').selectmenu("refresh"); 

Esto hace que el la caída estilizada hacia abajo para mostrar el valor correcto.

Answer 5

He intentado lo siguiente y no funciona en mi situación

1.

$('#ListId').val(value); 
$('#ListId').selectmenu("refresh"); 

2.

$('#ListId').selectmenu("value", value); 

3.

var option = $("#ListID option") 
option.attr("selected", true); 
// option.prop("selected", true); 
// option.attr("selected", "selected"); 
// option.prop("selected", "selected"); 
$('#ListId').selectmenu("refresh"); 

actualización , seleccionado ... etc. y en alguna situación no funciona.

Por lo tanto, presione ctrl +I en cromo para ver el código fuente. y uso el siguiente código para resolver mi situación.

// Set Component Separator jQuery UI SelectMenu 
componentSeparatorPlaceHolder.find(".ui-selectmenu-text").html(inputComponentSeparatorStr); 
// Set ComponentSeparatorDropDown 
componentSeparator.val(inputComponentSeparatorStr); 

Answer 6

me han tratado las siguientes maneras, y funciona en mi situación

$('#ListId').find('option[value=""]').attr("selected", true);  

O

$('#ListId').prop('selectedIndex', 0);