Ajax Tooltips with data-id

Ajax Tooltips with data-id

I´m using qtip2 ajax-tooltips. This is the script
(http://jsfiddle.net/craga89/L6yq3/):
// Create the tooltips only when document ready
$(document).ready(function()
{
// MAKE SURE YOUR SELECTOR MATCHES SOMETHING IN YOUR HTML!!!
$('a').each(function() {
$(this).qtip({
content: {
text: 'Loading...',
ajax: {
url: 'http://qtip2.com/demos/data/owl',
loading: false
}
},
position: {
viewport: $(window)
},
style: 'qtip-wiki'
});
});
});
To use the script i need the link of the ajax file:
<a href='http://qtip2.com/demos/data/snowyowl'>Snowy Owl</a>
I want to call the ajax file without the link, but with the data-id
attribute, so it looks like:
<a href="#" data-id="1">Snowy Owl</a>
How to make it?
To make it more clear, something like this code:
var urlFormat = "/content/web/tooltip/ajax/ajaxContent{0}.html";
$(document).ready(function() {
$("#products").qtip({
filter: "a",
content: {
url: "/content/web/tooltip/ajax/ajaxContent1.html"
},
width: 520,
position: "top",
requestStart: function(e) {
e.options.url = qtip.format(urlFormat,
e.target.data("id"));
}
});
$("#products").find("a").click(false);
});