Bootstrap .popover('show'), .popover('hide') Not Working. Binding It To Click Works
Solution 1:
In https://inputs.io/js/buttons.js the jQuery plugin jQuery.fn.popover
is overwritten on a load event of some kind, so $("#smiley").popover("hide")
at that point is no longer calling into bootstrap but the plugin provided by inputs.io
.
A snippet of the code:
Inputsio.load = function(){
(function(){(function(e){return e.fn.popover=function(t)
The usage of jQuery plugin namespace for application specific code is extremely distasteful indeed.
A temporary fix could be $("#smiley").click()
Solution 2:
here is a working fiddle that is "similar" to your code
HTML
<divstyle="margin-top:100px"><spanid="smiley"data-title="smile"data-toggle="clickover"><iclass="icon-comment"></i></span></div>
javascript
ClosePop = function () {
$('#smiley').popover('hide');
}
var elem = '<button data-toggle="clickover" class="btn" onclick="ClosePop();"><i class="icon-off"></i></button>';
$('#smiley').popover({
animation: true,
content: elem,
html: true
});
Solution 3:
Replace
$("#smiley").popover('hide');
with
$("#smiley").click();
Works for me in the console.
Solution 4:
try to move id="smiley"
from
<span class="btn tenpx smileypopover popover-trigger" id="smiley" data-original-title="" title="">
to
<div class="popover fade top in" style="top: 430px; left: 308.5px; display: block;">
Solution 5:
Is something like this out of the question?
$('#smileylist a').click(function(){
if($('.popover').css('display','block')){
$(this).css('display','none');
}
});
$('.smileypopover').click(function(){
if ($('.popover').css('display','none')){
$(this).css('display','block');
}
});
When I click on the smiley face it closes the popover, then I can't open it again until I run the 2nd block of code. It's very close but I'm not sure exactly what I'm missing.
Post a Comment for "Bootstrap .popover('show'), .popover('hide') Not Working. Binding It To Click Works"