行级别具有jQuery Datatable的jQuery popover

我使用jQuery Datatables来显示表中的数据，但希望每一行都有更多信息

我在哪里

我已经能够使用jQueryDataTable获取表中的数据，并且可以在每一行获取popover

问题 我一次只想显示一个popover，现在发生的是，我有一个代码，单击一行，我得到popover，当用户单击另一行时，我得到该行的另一个popover。由于我希望用户浏览所有的popover数据，并且用户也要单击popover上的链接，我不能保持popover

“触发器”：“悬停”

，这不允许用户读取/单击popover上的所有数据，但如果我使用手动，它不会在打开该页面上的另一个popover时自动关闭

我尝试过类似于

$（'tableid tbody tr'）.popover（'hide'）（认为这将隐藏与tr关联的每个popover）在打开popover之前，但这不起作用，或者更确切地说是阻止popover打开atall

我正在尝试使用js来显示弹出窗口

$（'tableid tbody tr'）.live（'click'，function（）{
如果（this.id.length>0）{

//$（'#tableid tbody tr'）.popover（'hide'）；
$（这个）({
//“触发器”：“手动”，
“容器”：“主体”，
'placement'：'right'，
“标题”：“另一项测试”，
“内容”：“测试”
}).popover（“show”）；
}
});

谁能给我指引正确的方向来解决这个问题

任何帮助都将不胜感激

谢谢
您可以使用这样的代码隐藏任何其他打开的弹出窗口

$('[data-toggle=popover]').on('click', function (e) {
   $('[data-toggle=popover]').not(this).popover('hide');
});

可以相应地修改
[data toggle=popover]
选择器，以便为每个TR创建popover

您可以使用这样的代码隐藏任何其他打开的弹出窗口

$('[data-toggle=popover]').on('click', function (e) {
   $('[data-toggle=popover]').not(this).popover('hide');
});

可以相应地修改
[data toggle=popover]
选择器，以便为每个TR创建popover

尝试使用：

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

    trigger:"click"

});

$('[data-toggle=popover]').on('click', function (e) {

    $('[data-toggle=popover]').not(this).popover('hide');

});

尝试使用：

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

    trigger:"click"

});

$('[data-toggle=popover]').on('click', function (e) {

    $('[data-toggle=popover]').not(this).popover('hide');

});

当我需要在每个单元格中切换popover时，您可以使用此方法，因为我一直在尝试此方法

$('#viewtable tbody').on('click', 'tr',  function () {
    $("#viewtable tbody tr").removeClass('row_selected');       
    $(this).addClass('row_selected');
    var tr = $(this).closest('tr');
    var selectedData = jDataTable.row(tr).data();
    console.log(selectedData);

    var dataaa = JSON.stringify(selectedData);
    var cont = '<div class="text-center" id="viewdiv"><button class="btn btn-warning" ng-click="viewticketdetails('+selectedData.ticketid+')"\>View Ticket</button><button class="btn btn-info" ng-click="updateticket()">Update Ticket</button></div>';                   

    $(this).popover({
        html: true,
        sanitize: false,
        trigger: 'click',
        placement: 'auto top',
        content : function(){
            return compile(cont)(scope);
        }
    }).popover('toggle');

    $('#viewtable tbody tr').off('click').on('click', function() {
    });
});

$（'viewtable tbody'）。在（'click'，'tr'，function（）{
$（“#viewtable tbody tr”）.removeClass（'row#u selected'）；
$（this.addClass（'row_selected'）；
var tr=$（this.nexist（'tr'）；
var selectedData=jDataTable.row（tr.data（）；
console.log（选择数据）；
var dataaa=JSON.stringify（selectedData）；
var cont='查看票证日期票证'；
$（这个）({
是的，
消毒：错，
触发器：“单击”，
位置：'自动顶部'，
内容：函数（）{
返回编译（续）（范围）；
}
}).popover（“切换”）；
$（'#viewtable tbody tr'）。关闭（'click'）。打开（'click'，函数（）{
});
});

希望这能帮到你。。让我知道这是否有助于您
当我需要在每个单元格中切换popover时，您可以使用此方法，因为我一直在尝试此方法

$('#viewtable tbody').on('click', 'tr',  function () {
    $("#viewtable tbody tr").removeClass('row_selected');       
    $(this).addClass('row_selected');
    var tr = $(this).closest('tr');
    var selectedData = jDataTable.row(tr).data();
    console.log(selectedData);

    var dataaa = JSON.stringify(selectedData);
    var cont = '<div class="text-center" id="viewdiv"><button class="btn btn-warning" ng-click="viewticketdetails('+selectedData.ticketid+')"\>View Ticket</button><button class="btn btn-info" ng-click="updateticket()">Update Ticket</button></div>';                   

    $(this).popover({
        html: true,
        sanitize: false,
        trigger: 'click',
        placement: 'auto top',
        content : function(){
            return compile(cont)(scope);
        }
    }).popover('toggle');

    $('#viewtable tbody tr').off('click').on('click', function() {
    });
});

$（'viewtable tbody'）。在（'click'，'tr'，function（）{
$（“#viewtable tbody tr”）.removeClass（'row#u selected'）；
$（this.addClass（'row_selected'）；
var tr=$（this.nexist（'tr'）；
var selectedData=jDataTable.row（tr.data（）；
console.log（选择数据）；
var dataaa=JSON.stringify（selectedData）；
var cont='查看票证日期票证'；
$（这个）({
是的，
消毒：错，
触发器：“单击”，
位置：'自动顶部'，
内容：函数（）{
返回编译（续）（范围）；
}
}).popover（“切换”）；
$（'#viewtable tbody tr'）。关闭（'click'）。打开（'click'，函数（）{
});
});

希望这能帮到你。。让我知道这是否对你有帮助
你能发布html和你迄今为止写过的任何js吗？@Jay你能做一把小提琴和/或编辑你的帖子吗？很好！）
popover
是由某种插件生成的吗？@SachinG:
popover
是由bootstrap-plugina创建的。你可以发布html和你迄今为止写过的任何js吗？@Jay你能做一把小提琴和/或编辑你的帖子吗？很好！）而
popover
是由某种插件生成的吗？@SachinG:
popover
是由bootstrap plugin创建的问题是，由于我的表行是动态创建的，我需要使用.live参数将click事件附加到每一行。当我使用你的.not（此）代码时，我只能获得第一个popover（无论我单击哪一行），之后任何一行上都不会打开popover。你不需要使用.live--.on是首选方法。谢谢@Skelly，我已更改了我的代码，因此，我只在悬停时显示popover，并且在行级别添加了click事件。感谢您创建该演示，将有人使用。我遇到的问题是，由于我的表行是动态创建的，所以我需要使用.live参数将单击事件附加到每一行。当我使用你的.not（此）代码时，我只能获得第一个popover（无论我单击哪一行），之后任何一行上都不会打开popover。你不需要使用.live--.on是首选方法。谢谢@Skelly，我已更改了我的代码，因此，我只在悬停时显示popover，并且在行级别添加了click事件。感谢您创建的演示，将有人使用。