javascript — Qtip не работает при первом нажатии, затем при следующем нажатии все ОК

Я использую плагин jQuery qtip. Я хочу, чтобы содержимое qtip было php-кодом, загруженным динамически. Вот мой код Ajax:

$(document).ready(function(){
$('.mapa').qtip({
show: 'click',
hide: 'click',
content:{
text: function(event, api) {
$.ajax({
url: '/google_maps/mapa.php'
})
.then(function(content) {
api.elements.tooltip.html(content);
}, function(xhr, status, error) {
api.set('content.text', status + ':  ' + error);
});
return 'Loading...'; // Set some initial text

},
},
position: {
my: 'top right',
at: 'top center',
},
style: {
classes: 'qtip-blue',
}
});
});

Затем я выбираю ссылку с id = «mapa», чтобы загрузить Qtip с php-кодом. Первый щелчок без загрузки php-кода в Qtip, второй и следующий щелчок, Qtip работает OK. Если я обновляю страницу, опять не работает сначала, во-вторых, все ОК.
Может кто-нибудь мне помочь? Ошибка в моем вызове на ajax? Или в другом месте?
Большое спасибо за любую помощь.