Назначить результат вызова контроллера Ajax для select2, используя нумерацию страниц - PullRequest
Новая
       8

Назначить результат вызова контроллера Ajax для select2, используя нумерацию страниц

0 голосов
/ 10 октября 2018

У меня проблема с назначением большого набора данных для выпадающего списка jQuery select2.У меня есть вызов контроллера Ajax, который возвращает данные о клиенте (идентификатор и имя) и назначает их в раскрывающемся списке select2 внутри успешного вызова Ajax.Проблема в том, что у меня около 77 тыс. Записей клиентов, и из-за того, что select2 плохо с этим справляется, и браузер зависает через несколько секунд.

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

У меня есть функция javascript, которая получает данные от контроллера (Ruby) и назначает их для выбора выпадающего спискас помощью select2. 

function updateCustomerList(teamId, customerSelectInput) {
    if(teamId !== undefined) {
        $.ajax({
            dataType: "json",
            url: "/team/customers",
            data: {team_id: teamId},
            success: function(data) {
                $(customerSelectInput).select2({
                    createSearchChoice: createSearchChoiceFunction,
                    placeholder: "Search for customer"],
                    data: data
                });
            },
            error: function(jqXHR, textStatus, errorThrown) {
                displayError(jqXHR.responseText)
            }
        });
    }

    var createSearchChoiceFunction = function(term, data) {
        if ( $(data).filter( function() {
                return this.text.localeCompare(term)===0;
            }).length===0) {
            return {id:term, text:term};
        }
    }
}

Метод контроллера FYI Team "Customers" просто делает запрос к коллекции клиентов и получает всех клиентов по идентификатору команды и возвращает результат в виде объекта json.

Любой видпомощи / руководства будет оценен!

1 Ответ

0 голосов
/ 10 октября 2018

У меня около 77 тыс. Записей клиентов, и из-за того, что select2 плохо с этим справляется, и браузер зависает через несколько секунд.

Что ж, это произошло потому, что все данные загружаются в память,вы увидите, что вся ваша оперативная память отключится.В DOM создано множество <options>, и chrome будет рад съесть всю вашу память.

Я думаю, что вы можете получить лучшие результаты с помощью Algolia API и Autocomplete.js, который представляет собой библиотеку JavaScript, которая добавляет быстрое и полнофункциональное меню автозаполнения в поле поиска, отображающее результаты «по мере ввода».

https://github.com/algolia/autocomplete.js

...