How to close popper tooltip when the button is clicked?

Question

I have button with tooltip created as

<button class="btn btn-xs btn-light"
        onclick="editMaterial(@material.Id)"
        title="Upravit materiál" data-tooltip="tooltip">
    <i class="fas fa-edit"></i>
</button>

Tooltip is activated using jQuery

$('[data-tooltip="tooltip"]').tooltip()

the issue is that when I click on the button and modal window opens, the tooltip is also open. So the tooltip interfere with the modal.

I tried

$('[data-tooltip="tooltip"]').hide()
$('[data-tooltip="tooltip"]').show()

or

$('body').click()

unsuccessfully, any idea ?

Answer 1

I had the same problem. I fixed it for popper.js v1.x this way:

// FIX: Tooltip not hiding on button cklick
$('[data-toggle="tooltip"]').click(function () {
    $('[data-toggle="tooltip"]').tooltip('hide');
}); 

Hope this helps