This is a generic question.
I have the following code where #datatable is (you guessed it) a datatable
$("#datatable").on(
"mouseenter",
"td",
function(event) {
$(this).qtip(
{
content:"<button>Test</button>",
position: {
my: 'bottom left',
at: 'center right',
adjust : {
method: "shift"
},
viewport: $('#datatable')
},
show: {
event: event.type,
ready: true
},
hide: {
fixed: true
}
},
event
);
}
);
I would like to be able to use all the niceties of $(this) when I click my button in the qTip2 tooltip (e.g get the column name and/or the value of the cell).
jsFiddle here : when you click on the Test button, how would one show an alert with the column name for example ?
You could give your button a class and trigger on click after the tooltip has been rendered.
No need for the this-keyword:
content:"<button class='my-btn'>Test</button>",
/*...*/
events: {
render: function(e, api){
$(".my-btn").on("click", function(){
alert(api.target[0].innerText);
});
}
}