javascript - I am facing conflict in jquery ui tooltip and bootstrap.js, so I put the below solution as suggested for new alias and getting the error :- -

alias change- :

$.widget.bridge('uitooltip', $.ui.tooltip); 

now getting error while calling jquery tooltip new alias:

uncaught error: cannot call methods on uitooltip prior initialization; attempted call method 'option'...

here code snippet using :-

$(this).uitooltip( "option", "content", ""+ $(this).attr("data-content") ); 

where data-content works , commenting above part well.

the order of things essential...

<script src="js/jquery-1.11.1.js"></script> <script src="js/jquery-ui.js"></script> <script>     // handle jquery plugin naming conflict between jquery ui , bootstrap     $.widget.bridge('uibutton', $.ui.button);     $.widget.bridge('uitooltip', $.ui.tooltip); </script> <script src="js/bootstrap.js"></script> 

first must come jquery ui, call $.widget.bridge, , include of bootstrap.js

then init tooltips, use this:

$(document).ready(function(){     $('myselector').each(function(ind, ele){        var $this = $(this),            mycontent = $this.attr("data-content");        $this.uitooltip({"content":mycontent});     }); }); 

the problem original method is using method set option after widget initialized, not method set option on initialization. correct way on initialization so:

$(this).uitooltip({ "content": ""+ $(this).attr("data-content") });