Using bootstrap popover callback

Question

I'm currently using bootstrap popovers to add some additional fields to my form. To format my select boxes, I need to take advantage of the popover callback, however I seem to be unable to get the callback to fire. If you prefer to use jsfiddle, check it out here. Thanks for any suggestions.

$("[data-toggle=popover]").popover({
  html: true,
  content: function() {
    return $('#popover-content').html();
  },
  showCallback: function() {
    alert('called back');
  }
});

.container {
  padding: 20px;
}
.form-control {
  width: 120px;
}
.popover {
  max-width: 400px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <h3>Bootstrap 3 Popover HTML Example</h3>
  <ul class="list-unstyled">
    <li><a data-placement="bottom" data-toggle="popover" data-container="body" data-placement="left" type="button" data-html="true" href="#" id="login"><span class="glyphicon glyphicon-search" style="margin:3px 0 0 0"></span></a>
    </li>
    <div id="popover-content" class="hide">
      <form class="form-inline" role="form">
        <div class="form-group">
          <h1>My content</h1>
        </div>
      </form>
    </div>
  </ul>
</div>

Answer 1

There is no popover option showCallback instead try using one of Bootstraps built in popover events

So for example triggering the alert when the popover is shown you would do this

$("[data-toggle=popover]").on('shown.bs.popover', function () {
    alert('called back');
});

I updated your JS Fiddle for an example...