CODEWITHSUNDEEP
javascriptjqueryhtmltooltipevent-listener
Lucas
Lucas

Reputation: 301

How can I centralize bootstrap tooltip call?

I'm working on a project where all buttons use the tooltip, but not to instantiate on each screen I use the buttons. I wanted some way to instantiate every time I change the tab, or even a partial view. Any idea how to do this?

Button example:

<button class="btn" href="anywhere" title="button" data-togle="tooltip"></button>

We have the _layout page that load every single page of the project, but some divs are loaded and have the attr display:none; I want to make the tooltip instance every single page, for every single button, but without instance every page in project

I need to execute this code, i'v maded by every click event but this is not the best way, i need instantiate this:

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

my temporary solution was this

$('[data-toggle="tooltip"]').tooltip({
    container: 'body',
        trigger: 'hover'
    });
    window.addEventListener("click", function (event) {
    i = 0;

    timer = setInterval(function () {
        $('[data-toggle="tooltip"]').tooltip({
            container: 'body',
            trigger: 'hover'
        });

        if (i >= 2) {
             clearInterval(timer);
        }

             i++
    }, 500)
});

Upvotes: 1

Views: 161

Answers (2)

Lucas
Lucas

Reputation: 301

This is relay the way

$('[data-toggle="tooltip"]').tooltip({
    container: 'body',
        trigger: 'hover'
    });
    window.addEventListener("click", function (event) {
    i = 0;

    timer = setInterval(function () {
        $('[data-toggle="tooltip"]').tooltip({
            container: 'body',
            trigger: 'hover'
        });

        if (i >= 2) {
             clearInterval(timer);
        }

             i++
    }, 500)
});

Upvotes: 0

wikola
wikola

Reputation: 111

Look $.live http://api.jquery.com/live/

Attach an event handler for all elements which match the current selector, now and in the future.

$('[data-toggle="tooltip"]').live('click', function(){
    $(this).tooltip({
        container: 'body',
        trigger: 'hover'
    });
});

Upvotes: 1

Related Questions