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

<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"