Измените значение поля выбора Chosen.js, используя jQuery

Я пытаюсь изменить значение поля выбора, которое имеет Chosen.js overlay. Идея состоит в том, чтобы изменить выбранное значение, когда пользователь нажимает кнопку.

С помощью регулярного блока выбора я могу изменить значение, выполнив:

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

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

Но с Chosen.js это больше не работает. Я пробовал несколько вещей, но ничего не сработало. Любые идеи, как заставить его работать?

Fiddle

Ответы

Ответ 1

Итак, после публикации этого вопроса я продолжал пытаться решить эту проблему и выяснил, как это сделать.

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

Ключ должен был поставить .chosen() перед .change(), а затем вызвать "liszt: updated". Он работает, но я не знаю, подходит ли это для этого.

Если у вас есть лучший способ сделать это, пожалуйста, дайте мне знать

Ответ 2

Я наткнулся на это, пытаясь понять это сам.

Я смог сделать это с комбинацией изменения выбранного индекса в исходном поле и затем запускать событие liszt:updated в этом поле:

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

Ответ 3

Просто обновление (я нашел эту страницу из Google, возможно, другие люди тоже ее найдут)

Я попытался прокомментировать ответ @splitz, но я не мог, потому что у меня все еще недостаточно репутации.

Новый способ сделать это:

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

Теперь трюк - это "выбранный: обновленный".

Обновленный ответ найден в: Изменение выбора в элементе с помощью выбранного вами модуля

Ответ 4

С плагином Chosen.js он работает.

var myIndex = 4;

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