Creating dynamic jQuery tooltips for dynamic content
- by Mel
I'm using the qTip jQuery plugin to create tooltips for a set of links.
Two problems:
How do I create a set of tooltips for three dynamically generated links where the content of the tooltip will also be dynamic:
a href="books.cfm?bookID=11"Book One
a href="books.cfm?bookID=22"Book Two
a href="books.cfm?bookID=33"Book Three
I would like to create a tooltip for each link. Each tooltip will then load details about each book. Thus I must pass the bookID to the tooltip:
$('#catalog a[href]').each(function()
{
$(this).qtip(
{
content: {
URL: 'cfcs/viewbooks.cfc?method=bookDetails',
data: { bookID: <cfoutput>#indexView.bookID#</cfoutput> },
method: 'get'
}
});
});
Unfortunately the above code is not working correctly. I've gotten it to work when I've used a static 'bookID' instead of a dynamically generated number.
Even when it does work (by using a static number for 'bookID', I can't format the data correctly. It comes back as a query result, or a bunch of text strings. Should I send back the results as HTML? Unsure.
PS: I am an absolute NOVICE to Javascript and jQuery, so please try not to be as technical.
Many thanks!
