In this article I will explain with an example, how to use table2excel jQuery plugin in ASP.Net MVC Razor.
Controller
The Controller consists of following Action method.
Action method for handling GET operation
Inside this Action method, simply the View is returned.
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
return View();
}
}
View
The View consists of an HTML Table and a Button.
Inside the jQuery document ready event handler, the Export Button has been assigned a jQuery Click event handler.
When the Export Button is clicked, the jQuery table2excel plugin is applied to the HTML Table and it is converted (exported) to Excel file.
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<table id="tblCustomers">
<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 type="text/javascript" src="~/Scripts/table2excel.js"></script>
<script type="text/javascript">
$(function () {
$("#btnExport").click(function () {
$("#tblCustomers").table2excel({
filename: "Table.xls"
});
});
});
</script>
</body>
</html>
Screenshots
The HTML Table
Excel file being downloaded when Export Button is clicked
The generated Excel file
Browser Compatibility
The above code has been tested in the following browsers.
* All browser logos displayed above are property of their respective owners.
Downloads