Currently, I am utilizing a basic bootstrap tooltip for creating tables with jQuery. However, I require a specific functionality that the standard bootstrap tooltip does not provide.
I need the ability to copy the base text and have it appear as "base text - hover text" when pasted into Excel. Since having two columns would make the table too large, I am exploring alternative solutions.
<a href="#" data-toggle="tooltip" title="hover text">base text</a>
$(document).ready(function(){
$("#query").click(function() {
$.ajax({
method: "GET",
url: $('#dns').val()
})
.done(function(data) {
if (data.Success == true) {
//This is where my table with tooltips is generated
parseResults(data.Results);
} else {
$('.dnsError').show();
}
$('[data-toggle="tooltip"]').on('copy', function(event) {
event.preventDefault();
console.log(this.title);
copyToClipboard(this.innerText + " - " + this.getAttribute('data-original-title'));
}).tooltip();
})
});
});
function copyToClipboard(text) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val(text).select();
document.execCommand("copy");
$temp.remove();
}