'addEventListener() is not working on a <span> text inside jsPDF autotable
I am trying to add a <span> element into one of my html table cells, and then register a click() listener to it. When the <span> is clicked, it should redirect to a certain page, along with some parameters. This is my code:
success: function(response) {
if(response[0]=='['){
const arr=JSON.parse(response);
for(var i=0; i<arr.length; i++){
var row = table.insertRow(table.rows.length);
for(var j=0; j<arr[i].length; j++){
var cell = row.insertCell(j);
if(j!=2)
cell.innerText=arr[i][j];
else{
let link = document.createElement('SPAN');
link.innerText='Click here';
link.style.color="red";
link.style.cursor="pointer"
link.addEventListener("click",function(){view_snippet(date.value,arr[i][0],arr[i][1],arr[i][2])});
cell.appendChild(link);
}
}
}
}
}
function view_snippet(date, name, desc, snipp){
sessionStorage.setItem("date",date);
sessionStorage.setItem("newspaper_name",name);
sessionStorage.setItem("news_desc",desc);
sessionStorage.setItem("snippet",snipp);
window.open('/view_page.html','_blank');
}
Now, I am trying to store my html table into a pdf and download it. For this purpose I am using jsPDF autotable library. This is my code:
//insert tables here
if(table!=null){
if(table.rows.length>1){
doc.autoTable({
html: '#news_pos_details',
startY: 144,
startX: 30,
theme: 'grid',
columnStyles: {
0: {
cellWidth: 40,
},
1: {
cellWidth: 60,
},
2: {
cellWidth: 30,
},
3:{
cellWidth: 15,
},
4:{
cellWidth: 40,
}
},
styles: {
fontSize: 10,
cellWidth: 'wrap'
}
})
}
else{
doc.setFontType("italic");
doc.text(52,174,"No news available in this section");
}
}
//doc.addpage()
doc.save('report.pdf');
In the pdf generated, I find that:
- The cursor pointer is not showing when I hover over the
<span>text. - The
<span>isn't red in color. - Most importantly, if I click on it, the function
view_snippet()isn't executed.
How do I fix this issue? Please help me.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
