jQuery tooltip disappears after AJAX DOM update

Question

In my layout template , just before closing body tag, I have a Javascript that initializes jQuery tooltips. Here it is (nothing extraordinary):

$('.grid-column-header, .small-button, .text-with-second-content').tooltip({ show: { effect: "none"} });

Everything works fine until I perform AJAX updates. For instance, an ASP. NET UpdatePanel that replaces a part of my DOM. After DOM is replaced, jQuery tooltip disappears.

Is there a way to address this issue?

p.s. this problem applies to other plugins. Sometimes I get around this problem just by calling pluting initialization code once again after AJAX call.

Answer 1

function InitTooltip(){$('.grid-column-header, .small-button, .text-with-second-content').tooltip({ show: { effect: "none"} });}
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(InitTooltip);