在表格内部使用bootstrap 3 popover不会显示在按钮顶部

问题描述

需要弹出框才能显示用户列表，但不显示在按钮顶部。

这是jQuery代码：

$('[data-toggle="popover"]').popover();

这是表行内动态按钮的C＃代码。

<br />
<button title='" + User List + @"' data-original-title='' type='button' class='btn btn-default popovers' data-toggle='popover' data-placement='top' data-html='true' data-content='" + rtnStr + "'>" + Show Users + @"</button>

解决方法

此问题通过计算元素的自定义宽度并找到弹出框的确切位置来解决。

这是jQuery代码

$(document).on('click','[data-toggle=popover]',function (e) {
            $('[data-toggle=popover]').not(this).popover('hide');
            var x = ($(window).width() - ($(this).offset().left + $(this).outerWidth().width()));
            $(this).popover('show');
            $('.popover').css({ "right": (x - 116) + "px","left": "auto" });
        });