Question

我已经检查了this question被问及动态更改Bootstrap popover内容的问题。但是这个解决方案似乎并不适合我的情况，我希望每次按下按钮显示我的popover时都会通过直接更改数据模板向用户显示新数据。

这是我的.js代码：

$(function () {
myUrl = "" + window.location.protocol + "//" + window.location.host + "/" + "Demo/Notification/LoadingStats";


$.ajax({
    url: myUrl,
    type: 'GET',
    success: function (data) {
        $('[data-toggle="popover"]').popover({
        template: data
        });
    }

})

上面的代码是我目前正在使用的工作代码，它可以正确显示我想要的数据，但不会流畅地改变或者当用户打开它时。只有在重新加载页面时才会更新数据。

以下代码是我根据上面链接的引用更改数据模板的无效功能。根据我内部发出的警报和调试程序，它似乎在解雇，但似乎没有做任何事情（它甚至不会显示一次弹出窗口）

我甚至尝试过使用setInterval（myfunction，2000）;

$('[data-toggle="popover"]').on('show.bs.popover', function () {

    $.ajax({
        url: myUrl,
        type: 'GET',
        success: function (data) {
            $('[data-toggle="popover"]').popover({
                template: data
            });
        }

    })
    });
    //these following three lines are firing correctly, just not doing what I want (refreshing the popover)
    var popover = $('[data-toggle="popover"]').data('bs.popover');
    popover.setContent();
    popover.$tip.addClass(popover.options.placement);
})

});

关于我可能做错的任何想法，或者如何动态更改弹出窗口的数据模板？

更新

我一直在忽略数据-html =＆＃34; true＆＃34;属性，这就是为什么我一直在想我必须使用数据模板而不是数据内容。您无法动态更新数据模板，但您完全可以动态更新数据内容。我希望这能帮助那些忽视数据的人。

Answer 1

我一直在忽略数据-html =＆＃34; true＆＃34;属性，这就是为什么我一直在想我必须使用数据模板而不是数据内容。您无法动态更新数据模板，但您完全可以动态更新数据内容。我希望这能帮助那些忽视数据的人。

动态更改Bootstrap弹出窗口的模板

1 个答案: