заполнение поля выбора Select2 массивом, заполненным запросом ajax - PullRequest
Новая
       9

заполнение поля выбора Select2 массивом, заполненным запросом ajax

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

Я хотел бы использовать Select2 для поля выбора, заполненного запросом ajay к API с одним вызовом API.Нет необходимости снова запрашивать API после каждого нажатия клавиши.

Я пытался реализовать его, используя этот поток: Как предварительно загрузить массив через ajax и использовать его для select2? , ноЯ все еще не могу заставить его работать в нерабочее время -.-

Мой код: 

<script type="text/javascript">
        $(document).ready(function() {
            var linkableSystems = [];
            $.ajax({
                url: 'ulrHere'
            }).done(function(data) {
                linkableSystems = data.results;
                console.log(linkableSystems);
                $('#SelectLinkedSystemToAdd').select2('enable', true);
            });
            $('#SelectLinkedSystemToAdd').select2({
                dataType: 'json',
                data: function () { return { results: linkableSystems }; }
            },
                console.log(linkableSystems)
            ).select2('enable', false);
        });


    </script>
<select id="SelectLinkedSystemToAdd" class="form-control"></select>

API возвращает: 

{
    "results": [
        {
            "text": "demo CLIENT 1",
            "id": 1
        },
        {
            "text": "demo CLIENT 2",
            "id": 2
        }
    ]
}

Я попытался заполнить поле выбора с помощью вызова ajax select2, и оно работает.Но я не могу заставить его работать так, чтобы он делал только 1 единственный вызов API.Согласно консоли, linkableSystems сначала пусто: 

[]
​length: 0

, а затем заполняется запросом ajax: 

(2) […]
​0: Object { text: "demo CLIENT 1", id: 1 }
​1: Object { text: "demo CLIENT 2", id: 2 }

К сожалению, эти изменения не воспринимаются Select2 какпредложено в теме, которую я связал выше.

Может кто-нибудь, пожалуйста, помогите мне с этим?Если вам нужна дополнительная информация, пожалуйста, спросите!

Спасибо!

1 Ответ

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

Имейте в виду, что эти запросы являются асинхронными. 

$.ajax({
  url: 'ulrHere'
}).done(function(data) {
  $('#SelectLinkedSystemToAdd').select2({data: data.results});
});

Нужно сделать свое дело, так как вы обновляете select2, когда данные действительно доступны.В случае, если вы инициализировали select2 до того, как он немного ненадежный.Возможно, вам придется выполнить $('#SelectLinkedSystemToAdd').select2('destroy') и заново установить выборку с данными.

...