<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.22/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
<script>
function exportToExcel()
{
var text="<table border='1px'><tr bgcolor='#87AFC6'>";
table = document.getElementById('tableId'); // id of your table
for(var i = 0 ; i < table.rows.length ; i++)
{
text=text+table.rows[i].innerHTML+"</tr>";
}
text=text+"</table>";
var ua = window.navigator.userAgent;
var msie = ua.indexOf("MSIE ");
tableData = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(text));
return (tableData);
}
function ExportToPDF() {
html2canvas(document.getElementById('tableId'), {
onrendered: function (canvas) {
var data = canvas.toDataURL();
var docDefinition = {
content: [{
image: data,
width: 500
}]
};
pdfMake.createPdf(docDefinition).download("Table.pdf");
}
});
}
</script>
</head>
<body>
<center>
<table id="tableId" bgcolor="yellow" border="2">
<th>RollNo</th><th> Name</th><th>Course</th><th> Phone</th>
<tr>
<td>4563</td>
<td>Yash</td>
<td>BCA</td>
<td>938499944</td>
</tr>
<tr>
<td>4593</td>
<td>jatin</td>
<td>MCA</td>
<td>9353499944</td>
</tr>
<tr>
<td>4563</td>
<td>Yash</td>
<td>BCA</td>
<td>938499944</td>
</tr>
<tr>
<td>4593</td>
<td>jatin</td>
<td>MCA</td>
<td>9353499944</td>
</tr>
</table>
<br><br><button onclick="exportToExcel();"> ExportToExcel </button><button onclick="ExportToPDF();">Export to PDF</button>
</center>
</body>
</html>