How can I close / dismiss Bootstrap Popover when clicking the popover trigger element?
Do you want work like this ?
http://jsfiddle.net/kAYyR/3/
$('#popoverId').popover({
html: true,
title: 'Popover Title<a class="close" href="#");">×</a>',
content: $('#popoverContent').html(),
});
$('#popoverId').click(function (e) {
e.stopPropagation();
});
$(document).click(function (e) {
if (($('.popover').has(e.target).length == 0) || $(e.target).is('.close')) {
$('#popoverId').popover('hide');
}
});
I use this:
$('[data-toggle="popover"]').popover({html: true, container: 'body'});
$('[data-toggle="popover"]').click(function (e) {
e.preventDefault();
$('[data-toggle="popover"]').not(this).popover('hide');
$(this).popover('toggle');
});
$(document).click(function (e) {
if ($(e.target).parent().find('[data-toggle="popover"]').length > 0) {
$('[data-toggle="popover"]').popover('hide');
}
});