Twitter Bootstrap Popover с динамическим контентом

Я пытаюсь получить Popup popovers для работы с динамическим контентом. У меня есть запрос jQuery AJAX, который возвращает некоторые строки данных. Функция успеха AJAX будет циклически проходить и генерировать HTML-код из извлеченных данных. Сгенерированный HTML имеет в нем код Bootstrap, но он не работает. Если я просто напишу HTML-код нормально, он отлично работает.Twitter Bootstrap Popover с динамическим контентом

Это пример того, что я пытаюсь сделать. newRowReg просто просматривает каждую полученную запись и добавляет ее в строку HTML.

newRowReg += "<tr>"; 
newRowReg += "<td>" + xStatus + "</td>"; 
newRowReg += "<td><img src='green dotx.jpg' class='ppt1' data-container='body' data-toggle='popover' data-placement='right' data-content='Vivamus sagittis lacus vel augue laoreet rutrum faucibus.'>"; 
newRowReg += "</tr>"; 
$("#regTbl").append(newRowReg);

Код Javascript для всплывающего окна.

$('.ppt1').popover({ 
    title: 'Title 1', 
    trigger: 'hover', 
    content: 'Some Content!' 
    });

Как заставить это работать, когда оно генерируется динамически?

источник

2014-02-14 JimC

Это, возможно, были обсуждены здесь: http://stackoverflow.com/questions/12140491/bootstrap-popover -with-knockout-js. За исключением того, что он использует обработчики событий. Я бы просто вызвал функцию popover после успеха ajax. – zer02

Функция popover вызывается после AJAX. – JimC

@ zer02 - Я проверил ссылку, которую вы предложили. Я новичок в jQuery и Bootstrap, поэтому я не понял, как применить этот совет к моей ситуации. Может ли кто-нибудь помочь с моим делом? Как заставить Popovers работать с HTML, который добавляется после загрузки страницы? – JimC

Позволяет иметь связь, как этот

<a href="#" id="show_media" class="btn btn-small btn-info" 
          rel="popover" 
          value="{{ $value->id }}" 
          data-content="<div id='div{{ $value->id }}'></div><script>loadMedia({{ $value->id }})</script>" 
          data-original-title="My Title">Show Media</a>

Тогда, прежде чем тело заканчивается

<script> 
    $(function(){ 
     $("#show_media").popover({placement: 'top', html: true}); 
    }); 
    function loadMedia(adsId){ 
     console.log("Ads ID: " +adsId); 
     $('div#div' + adsId).html('xxxx'); 
    } 
    </script>

источник

2014-07-15 16:33:54 Wen

Twitter Bootstrap Popover с динамическим контентом

ответ

Смежные вопросы