После динамической загрузки большого количества опций выпадающий список перестает работать

Я работаю над выпадающим меню select2 multiselect. Но я пытаюсь динамически загружать опции в раскрывающийся список при выборе другого раскрывающегося списка. Когда я выбираю значение в раскрывающемся списке, ajax-запрос отправляется на сервер, и данные c означают, что пользователь приходит, и это не что иное, как мои параметры, которые я пытаюсь загрузить в другое раскрывающееся меню. Ниже приводится раскрывающийся список, в который я пытаюсь загрузить данные.

$(document).on('change','#platform', function(){
        var platform_value = $(this).val();

        $.ajax({
            url: '/myroute/function_name',
            type: 'Get',
            dataType: 'json',
            data : {platform_value:platform_value},
            success: function (res) {
                console.log('options ready');
                if(res != ""){
                    $('#user_id').html(res);
                    $('#user_id').select2();``
                }
            }
        });
    });

мой res Объект будет содержать следующие значения.

"<option value=\"1\">abcd</option><option value=\"16000\">ajsha</option>"

Мне дают только два варианта референции. Но на самом деле это более 16000 вариантов. Поэтому, как только я выбираю платформу и ajax-запрос выполняется до тех пор, пока параметры не загружаются в мой выпадающий список, вся моя страница работает неправильно Даже мой раскрывающийся список не работает должным образом. Требуется много времени, чтобы выбрать только один вариант.

Пожалуйста, помогите мне в этом. Я столкнулся с этой проблемой и потратил много часов, чтобы решить эту проблему.

1 ответ

Решение

Поскольку 16000 - это очень большое количество опций для рендеринга с помощью select2, требуется время для создания DOM и рендеринга на странице. При этом страница будет плохо себя вести, как вы испытываете. Решение состоит в том, чтобы не загружать все 16000 опций одновременно, загружать топ 1000 результатов и лениво загружать другие опции при прокрутке или с помощью поиска. Надеюсь, это поможет.

Другие вопросы по тегам