How do you destroy a Bootstrap popover created with a selector option? e.g.
$e.popover({
selector: 'mark',
trigger: 'hover',
container: "body",
});
If you then call $e.popover('destroy') you get an error.
I note that the Plugin function called by popover('destroy') is as follows:
function Plugin(option) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.popover')
var options = typeof option == 'object' && option
var selector = options && options.selector
if (!data && option == 'destroy') return
if (selector) {
if (!data) $this.data('bs.popover', (data = {}))
if (!data[selector]) data[selector] = new Popover(this, options)
} else {
if (!data) $this.data('bs.popover',(data = new Popover(this, options)))
}
if (typeof option == 'string') data[option]() /// <<-- THIS ALWAYS FAILS
})
}
If you call $e.popover('destroy') the above line (clearly marked) always fails because it is calling data['destroy'], however the data will be an object like {mark: Popover}.
It should clearly be calling data['mark']['destroy'] but it is not immediately clear to me how this is supposed to happen.
One option is to create a string s = 'destroy' then add the selector property to the string, but it should be apparent that that is not the intended design.
Alternatively, one could call $e.data('bs.popover').mark.destroy(), but again I am not sure that's the intended design, and it's not documented anywhere I could find.
Here's a sample jsFiddle
