bootstrap tooltip did not hide, in second page

Question

I am using Bootstrap tooltip for my project. this is my first page view

First Page

When i click this view button, page navigate to the second page. but Tooltip did not hide.

Second page

what is the reason for this? how I solve this.

this is the button html code

 <div class="btn-group-xs">

                                    <a target="_self" href="app/customer-view/{{users.id}}"
                                        class="btn btn-flat btn-xs btn-success" data-toggle="tooltip"
                                        data-placement="bottom" title="View" tooltip>
                                        <i class="ion ion-eye"></i>
                                    </a>
                                    <a target="_self" href="app/customer-edit/{{users.id}}"
                                        class="btn btn-flat btn-xs btn-primary" data-toggle="tooltip"
                                        data-placement="bottom" title="Edit" tooltip>
                                        <i class="ion ion-edit"></i>
                                    </a>
                                </div>

Answer 1

You can use this type of code:

$(".yourButton").click(function(){
  $("[data-toggle='tooltip']").tooltip('hide');
});

Or (in this case tooltip will hide automaticaly)

$(document).ready(function () {
   $("[data-toggle='tooltip']").tooltip('hide');
});