2014-04-14 17 views
8

Kullanıcıya gönderilen e-postalar listesini göstermek için Bootstrap Popover'ı kurmaya hazırım. Bu nedenle içerik, bir ajax çağrısı aracılığıyla dinamik olarak oluşturulur. Gördüğünüz gibiTwitter Bootstrap Popover, ajax aracılığıyla dinamik olarak oluşturulmuş içeriğe sahip

$('#liste').on('mouseover', 'tr[data-toggle=popover]', function(e) { 
     var $tr = $(this); 
     id = $(this).data('id'); 
     $.ajax({ 
      url: '<?php echo $this->url(array(), 'loadRelance');?>', 
      data: {id: id}, 
      dataType: 'html', 
      success: function(html) { 
       $tr.popover({ 
        title: 'Relance', 
        content: html, 
        placement: 'top', 
        html: true, 
        trigger: 'hover' 
       }).popover('show'); 
      } 
     }); 
    }); 

, bu <table> ait <tr> 's her mouseover üzerinde bir ajax arama tetiklemek edeceğiz: İşte kod benim parçasıdır. Sayfa ilk kez yüklendiğinde mükemmel çalıştığı için, gönderilen posta sayısında bir değişiklik yaptığımda, tekrar yaptığım zaman güncellenmiş listeyi göstermez (eğer sayfayı yeniden yüklersek çalışır)). Chrome Developper Araç Çubuğu'ndaki XHR isteklerinin önizlemesinde güncellenmiş bir liste görebiliyorum, ancak bunu içeriğin içeriğine yüklemiyor. Eski listeyi koruyor.

Herhangi bir yardım çok takdir edilecektir. Teşekkürler!

+1

Her Mouseover için yeni popover yaratıyor. $ Tr.popover ('destroy') kullanmalısınız; $ Tr.popover ({seçenekleri}) popover ('şov.'); –

+0

Çok teşekkürler! $ Tr.popover ('destroy') eklemek; 'ajax 'çağrısından hemen önce hile yaptı! – D4V1D

cevap

10

kullanarak mevcut popover yok etmeliyiz:

$tr.popover('destroy'); 

Ardından kodunu kullanarak yeni popover oluşturun:

$tr.popover({options}).popover('show'); 
İlgili konular