Skip to content Skip to sidebar Skip to footer

Bootstrap .popover('show'), .popover('hide') Not Working. Binding It To Click Works

I have a button that has been binded to a popover. I would like to hide the popover when someone clicks on one of the smilies in the popover. However, $('#smiley').popover('hide')

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

http://jsfiddle.net/6hkkk/7/

HTML

<div style="margin-top:100px">
    <span id="smiley" data-title="smile" data-toggle="clickover">
        <i class="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:


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"