Визуализация HTML ответа AJAX - PullRequest
0 голосов
/ 21 мая 2018

Я использую удаленную опцию Select2 AJAX для получения данных:

$('#t').select2({
    ajax: {
        url: '../ajax/results.php',
        data: function (params) {
            return {
                search: params.term,
                page: params.page || 1
            };
        }
    }
});

Пока все хорошо, результат возвращается так (обратите внимание на тег <small>):

{
    "results": [
        {
            "id": "1",
            "text": "Doe Joe, <small>Mr.</small>"
        },
        {
            "id": "2",
            "text": "Smith Anne, <small>Mrs.</small>"
        },
        {
            "id": "3",
            "text": "Rossi Mario, <small>Mr.</small>"
        },
        ...
     ],
     "pagination": {
         "more": false
     }
}

В <select> тег <small> печатается как есть, а не анализируется.Select2 docs говорит, что HTML не отображается по умолчанию и что полученный результат должен быть обернут в объект jQuery, но дальнейший пример не приводится.

Все примеры, которые включают templateResult, действительно, не дает обратной связи о том, как передать результат AJAX (то есть https://select2.org/dropdown#templating)

Пожалуйста, любая помощь?

1 Ответ

0 голосов
/ 22 мая 2018

Пример шаблонов правильный, мне просто нужно обернуть все в тег <span>, чтобы он работал:

function formatItem (item) {
    if (!item.id) {
        return item.text;
    }
    return $('<span>' + item.text + '</span>');
}

$('#t').select2({
    ajax: {
        url: '../ajax/results.php',
        data: function (params) {
            return {
                search: params.term,
                page: params.page || 1
            };
        }
    },
    templateResult: formatItem,
    templateSelection: formatItem
});
...