In this article I will explain with an example, how to convert (export) HTML Table to
Excel file using
jQuery.
HTML Markup
The following HTML Markup consists of an HTML Table and a Button.
<table id="tblCustomers" cellspacing="0" cellpadding="0">
<tr>
<th>Customer Id</th>
<th>Name</th>
<th>Country</th>
</tr>
<tr>
<td>1</td>
<td>John Hammond</td>
<td>United States</td>
</tr>
<tr>
<td>2</td>
<td>Mudassar Khan</td>
<td>India</td>
</tr>
<tr>
<td>3</td>
<td>Suzanne Mathews</td>
<td>France</td>
</tr>
<tr>
<td>4</td>
<td>Robert Schidner</td>
<td>Russia</td>
</tr>
</table>
<br />
<input type="button" id="btnExport" value="Export" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="table2excel.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#btnExport").click(function () {
$("#tblCustomers").table2excel({
filename: "Table.xls"
});
});
});
</script>
Explanation:
Note: You will get a Warning message from Microsoft Excel application when you try to open the generated Excel file. This Warning is shown because the generated file is not a valid Excel format as the plugin simply exports the HTML content to an Excel file.
Screenshots
The HTML Table
![Convert (Export) HTML Table to Excel file using jQuery]()
Excel file being downloaded when Export Button is clicked
![Convert (Export) HTML Table to Excel file using jQuery]()
The generated Excel file
![Convert (Export) HTML Table to Excel file using jQuery]()
Browser Compatibility
* All browser logos displayed above are property of their respective owners.
Demo
Downloads
