Как выбрать параметр в jQuery ui selectmenu динамически?

После изменения меню из регулярного выбора в jQuery selectmenu я больше не могу выбирать опции в нем программно. Есть ли способ сделать это?

Код для выбора (если ListId является фактическим идентификатором списка)

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

Плагин активируется следующим образом:

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

Есть ли способ выбрать элемент в меню выбора? Вызов той же функции .val(value) просто выбирает значение в скрытом исходном списке выбора, а не в избранном jQuery selectmenu.

Ответ 1

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

Ответ 2

Предполагая, что вы уже сделали эту часть раньше:

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

Я нашел, что это работает:

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

Это приведет к тому, что стилизованный снимок будет отображаться правильно.

Ответ 3

Вы можете дополнительно запустить обработчик события изменения, добавив вызов изменения:

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

Ответ 4

Обратите внимание, что для выбора опции с помощью этого метода вы должны использовать индексы (не значения).

Например, данный выбор.

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

В этом случае выражение $('#ListId').selectmenu("value", "value-two"); не вернет никакого результата. Вместо этого мы должны использовать $('#ListId').selectmenu("value", "2");. Другими словами, мы должны использовать позицию/индекс элемента внутри select. Не значение!

Найти индекс легко. Для достижения этой цели вы можете использовать следующую строку.

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

Ответ 5

Я пробовал следующее, и он не работает в моей ситуации

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

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

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

обновить, выбрать.... и т.д. и в некоторых ситуациях это не сработает.

Поэтому я нажимаю ctrl + I в chrome, чтобы увидеть исходный код. и я использую следующий код для решения моей ситуации.

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

Ответ 6

Я пробовал следующие способы, и он работает в моей ситуации

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

ИЛИ

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