Как динамически привязать параметры к элементу select2 - PullRequest
0 голосов
/ 06 декабря 2018

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

HTML:

<select class="select2 select2-hidden-accessible ddlSegments" multiple=""></select>

Вот функция, которая запускаетдля каждой буквы, которую вводит пользователь.

JS:

function GetSegmentsByKeyword(ddlSegments, keyword) {
    $(ddlSegments).html("").trigger("change");
    $.ajax({
        type: "POST",
        url: "/Common/GetSegmentsByKeyword",
        data: "{'keyword': " + JSON.stringify(keyword) + "}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",            
        success: function (response) {
            if (response.Segments.length > 0) {
                //bind data
                var options = "";
                var jsonObject = $.parseJSON(response.Segments);

                $.each(jsonObject, function (i, obj) {
                    options += '<option value="' + obj.SegmentValue + '">' + obj.DisplayName + '</option>';
                });

                $(ddlSegments).append(options);                
            }
        }
    });
}

Вот проблема, с которой я сталкиваюсь:
Когда пользователь ввел слово «12», соответствующийданные из таблицы возвращаются и привязываются к параметрам.Но всплывающий список не отображается.Он появляется только после того, как пользователь вводит другую букву.

, т.е., когда пользователь вводит '12', правильные данные связываются и не показывают список.Но когда пользователь вводит «123», список появляется.Тем не менее, данные в списке относятся только к «12».Когда пользователь вводит «1234», появляется список с данными, относящимися к «123».

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

Ответы [ 2 ]

0 голосов
/ 18 декабря 2018

Полагаю, вы пропустили запуск события при включении ключа в select2, например, например, $(document).on('keyup', '.ddlSegments', function (e), пожалуйста, проверьте скрипку здесь: Обновленная скрипта

0 голосов
/ 17 декабря 2018

Проверьте параметр конфигурации minimumSearchLength. Здесь - документация.

$('select').select2({
    minimumInputLength: 3 // only start searching when the user has input 3 or more characters
});
...