1

This seems like it would be a common case, but I cannot find any information on it. Perhaps it's something I'm just missing.

All tooltips are working as expected. However, we load some content dynamically, so it gets injected after the tooltip method is called.

What is the best way to get tooltips applied to new content which is injected after pageload?

UPDATE To be clear, I am not looking for how to inject dynamic content into a tooltip. I am looking for how to get the tooltip plugin to notice new content injected into the page.

Thanks

Spot
  • 7,962
  • 9
  • 46
  • 55
  • never used this plug-in, but jquery-ui-pages says, you can use the `content` property with a function. wouldn't that solve your case? – Homungus Apr 21 '14 at 14:37
  • @Homungus I don't believe so. That has to do with how it determines what content to put in a tooltip. It happens *after* it has been told what elements to be applied to. I need to know how to tell it to apply to *new* elements in the DOM. – Spot Apr 21 '14 at 14:39
  • ah ok, so you want to add your tooltip to new, dynamically added elements of the page? – Homungus Apr 21 '14 at 14:43
  • @Homungus Correct. This is quite difficult to google, considering that everything comes up with the question you originally thought I was asking. :) – Spot Apr 21 '14 at 14:44

2 Answers2

1

I would do like this: Make your tooltip-options reusable like this:

var options = { content: "Awesome title!", ... }

Then make your first-tooltip-init on page load:

$('.someclass').tooltip(options);

After adding some new elements dynamically do like this:

$(dynamicallyaddedcontent).tooltip(options);
Homungus
  • 1,114
  • 1
  • 10
  • 20
  • Thank you. Yeah, this has been at the top of my possibilities list. However, before putting this in production, I wanted to ask on SO to make sure there is not an "official" manner to notify the plugin of new content, which I've been missing. Again, thanks! – Spot Apr 21 '14 at 14:53
  • 1
    yes, i would be interested in such a solution also, but as far as i know, this is the way. – Homungus Apr 21 '14 at 14:55
0

The jquery tooltip is a simple div, and as such you can inject content the same way you do with normal divs, using methods like JQuery's append. Best explained here.

EDIT: To match your edit I suppose you can find your answer here. Look at the second answer (the one with the more upvotes, not the accepted solution since it's deprecated)

Community
  • 1
  • 1
Hristo Valkanov
  • 1,689
  • 22
  • 33
  • I appreciate the answer, but I believe you are misunderstanding my question. I don't need to know how to get dynamic content into a tooltip. – Spot Apr 21 '14 at 14:40
  • Thank you. I know how to detect the changes. In fact, in this situation I am the one which initiating the new content getting injected. However, the Jquery UI tooltip plugin does not seem to have a method which causes it to reindex the contents of the DOM. Simply rerunning the same command across the entire page seems messy (although that might be the answer). Therefore, again, this is not a question about how to know when it's happening, it's about the proper pattern for telling the plugin about the change. – Spot Apr 21 '14 at 14:51
  • Do you need support for IE? – Hristo Valkanov Apr 21 '14 at 15:05
  • Yes, I do. The best way seems to be rerunning the tooltip method on the new content. There does not seem to be a "native" manner to do it from within the tooltip plugin directly. – Spot Apr 21 '14 at 16:34