Nội dung cửa sổ bật lên Twitter bootstrap js không cập nhật khi thuộc tính data-content được cập nhật

Question

Tôi đang sử dụng cửa sổ bật lên để hiển thị một số thông tin mà tôi đang cập nhật sau khi yêu cầu ajax. Về cơ bản, tôi đang cập nhật thuộc tính data-content của phần tử kích hoạt popover khi di chuột qua. Tôi đang kiểm tra dom và nội dung dữ liệu chắc chắn đang cập nhật, nhưng nội dung của cửa sổ bật lên vẫn giữ nguyên. Tôi đã cố gắng tất cả mọi thứ tôi có thể nghĩ và bắt đầu cảm thấy như tôi đang thiếu một cái gì đó đơn giản. Ai đó có thể giúp tôi không. Cô một số mã:

<ul> 
    <li class="player_name_li" rel="popover" data-placement="right" 
    data-html="true" data-title="Dude" data-trigger="hover" 
    data-content="<div class='custom_content'>Heres some content</div>" 
    data-original-title="" title=""><span class="player_name">Dude</span> 
    </li> 
</ul> 

và sau đó kịch bản của tôi

$(document).ready(function(){ 
$('.player_name_li').popover({ 
    template: '<div class="popover" style="width:250px;"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'}); 

setInterval(function(){update_scores();}, 6000); 

function update_scores() 
{ 
    $.ajax({ 
     url: HOST_NAME, 
     type: 'POST', 
     //async: false, 
     data: {player_array: my_data_is_generated_from_page)} 
    }).done(function(results){ 
     var obj = $.parseJSON(results);  
     //this reloads the stupid popover data 
     $.each(obj.fancy_return, function(index, value){ 
     $('.player_info_link').each(function(){    
      var huh = $(this).closest('li'); 
      huh.attr('data-content', value.new_table); 
       }); 
     )}; 
} 

bây giờ giống như tôi đã nói thats tất cả làm việc như tôi mong đợi, và cập nhật dữ liệu nội dung mỗi popover li của mà tôi xác nhận qua sự kiểm tra việc dom, nhưng khi tôi di chuột qua li nó vẫn hiển thị nội dung cũ của dữ liệu nội dung. Tôi đã xem xét thông qua một vài bài và cố gắng thiết lập nội dung theo chức năng trong instanciation của tôi của cửa sổ popover với content: function(){return $(this).data('content');} là tốt nhưng điều đó đã không làm việc. Tôi cũng đã cố gắng phá hủy và tái tạo từng phần tử không hoạt động nhưng kể từ khi nó ở trong một hàm khoảng thời gian và được kích hoạt tự động, nó đóng một popover mở nếu bạn có một mở mà làm cho nó có vẻ lỗi. Bất kỳ ý tưởng?

Answer 1

Bạn đúng là cách thích hợp để thực hiện việc này là cung cấp content: function(){return someDynamicContent}, như bạn đã đề cập. Vấn đề duy nhất tôi thấy rằng bạn có thể đã chạy vào là bạn có lẽ không biết rằng $('.player_name_li').data('content') không tự động đồng bộ với các thao tác của $('.player_name_li').attr('data-content'). Bạn cần phải chắc chắn rằng một trong những bạn thay đổi trong gọi lại AJAX của bạn là một trong những bạn tham khảo trong định nghĩa của content.

Nếu bạn xác định

$('.player_name_li') 
    .popover({ 
    template: '<div class="popover" style="width:250px;"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>', 
    content: function(){return $(this).data('content')} 
    }) 

Sau đó, bạn cần phải sử dụng

huh.data('content', value.new_table); 

Nếu bạn làm theo cách này, các plugin sẽ làm tất cả những reinitializing đằng sau hậu trường.