How can I dynamically disable popover from a DOM element?

Question

I have almost identical multiple divs on a page. They all have graphs inside I want some of them to have popovers when they are hovered.

I want to decide for each div if the popover is displayable or not. Is there a property that I can include inside options such as "diplay: false" ?

HTML

<div id="{{graph.id}}" data-ng-repeat="graph in graphs" data-placement="top" data-original-title="Parameters"></div>

JS

var options = {
    html: true,
    placement: 'top',
    trigger : 'hover',
    content: function() {
        return $('#info-chart-' + currentObj.id).html();
    }
}
$(currentObj.id).popover(options);

Answer 1

You can add some class to those elements on which you don't want popup like nopop class.

<div id="{{graph.id}}" class="nopop" data-ng-repeat="graph in graphs" data-placement="top" data-original-title="Parameters"></div>

Now change the jquery code.

$(currentObj.id).not(".nopop").popover(options);

You can check here --> JsFiddle