Reapply Twitter Bootstrap Tooltip after disable/destroying

Question

I have a simple question. I have data displayed from a selected item in a table, so it changes frequently. I am using this to check for overflow:

if (event.target.offsetWidth < event.target.scrollWidth) {

            if ($(event.target).attr('tooltip')) {
                $(event.target).tooltip('enable');
            } else {
                $(event.target).tooltip({
                    title: $(event.target).text(),
                    placement: 'bottom',
                    animation: false
                });
                $timeout(function () {
                    $(event.target).tooltip('show');
                });
            }
        } else {
            $(event.target).tooltip('disable');
        }

This works, but I cannot get the tooltip to show after being disabled. I have tried destroy in place of disable (which doesn't appear in the docs ) and adding the whole tooltip after it is destroyed. To no avail. How can I replace a destroyed/disabled tooltip?

Answer 1

If I am dynamically disabling and re-enabling the tooltip, I clear the 'bs.tooltip' first before calling the show. Something like this:

$('#element').data('bs.tooltip', null);
$('#element').tooltip({ placement: 'bottom' });
$('#element').tooltip('show');

And to disable:

$('#element').tooltip('disable');

Answer 2

Try this out this will work fine for you

$('#element').tooltip({
    title: 'My first tooltip'
}); // Add the tooltip

$('#element').tooltip('show'); // Show the tooltip

$('#element').tooltip({
    title: 'I want to change this tooltip'
}); // Try to change the tooltip

$('#element').tooltip('show'); // The tooltip will still say 'My first tooltip'

/****************************/

$('#element').data('tooltip', false); // Remove the previous tooltip

$('#element').tooltip({
    title: 'This is the new tooltip'
}); // Try to change the tooltip

$('#element').tooltip('show'); // The tooltip should say 'This is the new tooltip'