Tooltipster: содержимое HTML из AJAX не отображается - PullRequest
0 голосов
/ 14 октября 2018

У меня есть несколько таких ссылок на странице

<a href="{{ route('user_profile') }}"
   class="user-tooltip"
   data-uid="{{ $user->id }}>
    {{ $user->name }}
</a>

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

Это код, связанный со ссылками

$('.user-tooltip').tooltipster({
    interactive: true,
    content: 'Loading...',
    contentAsHTML: true,
    multiple:true,

    functionBefore: function(instance, helper) {
        var $origin = $(helper.origin);

        if ($origin.data('loaded') !== true) {
            $.get('https://localtest.mys/user-tooltip', 
                  {uid:$origin.data('uid')}, 
                  function(data) {
                        instance.content($(data));

                        $origin.data('loaded', true);
            });
        }
    }
});

При наведении ссылки появляется подсказка, содержащая сообщение Loading..., и через некоторое время подсказка становится пустой.Ответ от сервера правильный, я проверил, что это строка, содержащая правильные HTML-теги, но она не отображается внутри всплывающей подсказки.

Чего мне не хватает?

Tooltipster: http://iamceege.github.io/tooltipster/

Редактировать: пояснение, HTML-код, исходящий от сервера, помещается в подсказку (анализирует элемент, который я могу прочитать), но он не отображается.

Попыткас делегированием проблема та же:

$('body').on('mouseenter', '.user-tooltip:not(.tooltipstered)', function(){
    $(this).tooltipster({
        interactive: true,
        content: 'Loading...',
        contentAsHTML: true,

        functionBefore: function(instance, helper) {
            let $origin = $(helper.origin);

            if ($origin.data('loaded') !== true) {
                $.get('https://localtest.mys/user-tooltip', {uid:$origin.data('uid')}, function(data) {
                    instance.content($(data));

                    $origin.data('loaded', true);
                });
            }
        }
    }).tooltipster('open');
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...