Bootstrap Popover fail с ajax

Question

Я бы хотел использовать Bootstrap Popover с шаблонами ajax. Следующий скрипт работает хорошо, ...

$('.popover-trigger').bind('click', function(k) { 

       var e=$(this); 
title="Jeepieee" 
       $.get('/popover/'+e.data('pophtml'),function(d) { 
        e.popover({ 
          content: d, 
          container: 'body', 
          title: title, 
          html: true 
         }).popover('show'); 
       }); 
}); 

... но, если я открываю поповер по первым отправить ajaxcall, это правильно. Я снова открыть поповер, он показал мне мой HTML, но HTML от пирог старый и не Ajax-вызов ..

Когда я использую $(). Поповер («уничтожить»), то у меня есть нет клик-события на моей кнопке, и он ничего не открывает.

Если у меня несколько, это будет еще хуже.

Answer 1

Загрузка содержимого через AJAX в Bootstrap popover является очень распространенным шаблоном и, хотя он не поддерживается из коробки Bootstrap, очень легко получить эту функцию с помощью jQuery.

Прежде всего, мы должны добавить атрибут data-poload к элементам, которые вы хотели бы добавить, чтобы добавить всплывающее окно. Содержание этого атрибута должно быть URL для загрузки (абсолютное или относительное):

<a href="#" title="blabla" data-poload="/test.php">blabla</a> 

И в JavaScript, предпочтительно в $ (документ) .ready();

$('*[data-poload]').hover(function() { 
    var e=$(this); 
    e.off('hover'); 
    $.get(e.data('poload'),function(d) { 
     e.popover({content: d}).popover('show'); 
    }); 
}); 

off('hover') предотвращает загрузки данных более чем один раз, и popover() связывает новое событие парения. Если вы хотите, чтобы данные обновлялись при каждом событии , вы должны удалить его.

См. Рабочий пример JSFiddle примера.