带有链接和PHP的Bootstrap Popover

Question

I'm trying to use bootstrap popover to pop a confirmation window before deleting a record from my database-driven table. The code used to generate column with delete buttons looks like this:

echo "<td> <div class=\"popover-example list-inline\"><a class=\"btn btn-primary\" data-toggle=\"popover\" title=\"Are you sure?\" data-content=\"<a href=\"delete.php?id='. $row->id.' \">Delete</a></div></td>";

and my popover js looks like this:

$(document).ready(function(){
    $(".popover-example a").popover({
        placement : 'top'
        html: 'true'
    });
});

I know, that this echo is bit messy, but it works with plain text. I'd like to make the HTML with dynamically generated link appear in poprover. Is there any way to do it? I'd be grateful for a tip.

Answer 1

You can add dynamic and custom content in a popover like so

var myDynamicContent = $('<a>').attr('href', 'http://www.yahoo.com')
    .text('click here!');

$(".popover-example a").popover({
    placement : 'top'
    html: 'true'
    content: myDynamicContent
});

The content key of the popover plugin allows you to add custom content when the popover is triggered to open. You can also embed that value in the HTML markup, as a data-content="" value.