Как сделать автозаполнение данных динамически c?

Question

$(document).ready(function(){
    $('input.autocomplete').autocomplete({
        data: {
            "Apple": null,
            "Microsoft": null,
            "Google": 'https://placehold.it/250x250'
        },
        onAutocomplete: function () {
            var mobileSearch = $('#SearchM').val();
            var desktopSearch = $('#SearchD').val();

            if (desktopSearch.length > 0){ //Desktop Search
                window.location.href = '/'+desktopSearch;
            }
            else {
                window.location.href = '/'+mobileSearch;
            }
        }
    });
});

Я хочу получить данные из базы данных и распечатать их здесь. Это бессмысленно писать вручную, когда у вас более 5000 данных.

data: {
    "Apple": null,
    "Microsoft": null,
    "Google": 'https://placehold.it/250x250'
},

Мне удалось получить данные с адреса с помощью Fetch, но я не смог их распечатать.

var x = fetch('/alltags')
    .then(response => response.json())
    .then(data => {
        console.log(data);
        return data;
    });

Что я могу сделать?

Answer 1

Виджет JQuery автозаполнения ожидает свойство источника , содержащее параметры для отображения.

source принимает либо Array, String или Function.

Вы можете отобразить ответ от вашей выборки в массив объектов.

Массив source может содержать строки: [ "Choice1", "Choice2" ]

ИЛИ

Объекты со свойствами меток и значений: [ { label: "Choice1", value: "value1" }, ... ]

Например:

$(document).ready(function(){
    $('input.autocomplete').autocomplete({
        source: [{
            label: "Google",
            value: "https://placehold.it/250x250"
        } ...],
        onAutocomplete: function () {
            var mobileSearch = $('#SearchM').val();
            var desktopSearch = $('#SearchD').val();

            if (desktopSearch.length > 0){ //Desktop Search
                window.location.href = '/'+desktopSearch;
            }
            else {
                window.location.href = '/'+mobileSearch;
            }
        }
    });
});