使用C#或javascript将Table里的数据导出到Excel
使用C#或javascript将Table里的数据导出到Excel
原文:使用C#或javascript将Table里的数据导出到Excel
Demo效果图:
用C#将Table数据导出Excel:
本方法已经将导出excel做成分部视图,引用时只需在视图中使用如下代码即可:
@{ Html.RenderAction("Index", "ExportExcel", new { divId = "report", filename = "hidTitle" }); }
其中divId为table外层紧连的div的Id,filename为导出的excel名字。本模块使用MVC,以下为Controller部分,其中Index对应所述分布视图。
public class ExportExcelController : Controller { [HttpPost] [ValidateInput(false)] public ActionResult DownloadReport(FormCollection form) { string excelContent = form["hidTable"]; string filename = form["hidFileName"]; ExportToExcel("application/ms-excel", filename + ".xls", excelContent); return View(); } public void ExportToExcel(string FileType, string FileName, string ExcelContent) { System.Web.HttpContext.Current.Response.Charset = "UTF-8"; System.Web.HttpContext.Current.Response.ContentEncoding = System.Text.Encoding.UTF8; System.Web.HttpContext.Current.Response.AppendHeader("Content-Disposition", "attachment;filename=" + HttpUtility.UrlEncode(FileName, System.Text.Encoding.UTF8).ToString()); System.Web.HttpContext.Current.Response.ContentType = FileType; System.IO.StringWriter tw = new System.IO.StringWriter(); System.Web.HttpContext.Current.Response.Output.Write(ExcelContent.ToString()); System.Web.HttpContext.Current.Response.Flush(); System.Web.HttpContext.Current.Response.End(); } public ActionResult Index(string divId, string filename) { ViewBag.HidDivId = divId; ViewBag.FileName = filename; return PartialView(); } }
分布视图代码:
@{ Layout = null; } <script type="text/javascript" src="~/Scripts/jquery-1.10.2.js"></script> <form action="/ExportExcel/DownloadReport" method="post" style="display:inline"> <input type="hidden" id="hidTable" name="hidTable" value="" /> <input type="hidden" id="hidFileName" name="hidFileName" value="" /> <input type="submit" name="btn" id="btnclick" class="btn blue" value="导出Excel文件" /> </form> <script> $(function () { $("#btnclick").click(function () { $("#hidTable").val($("#@ViewBag.HidDivId").html()); $("#hidFileName").val($("#@ViewBag.FileName").val()); }); }); </script>
用javascript将Table数据导出Excel:
js文件地址:链接:http://pan.baidu.com/s/1jGwynWy 密码:kay1
使用方法:
<a download="@(ViewBag.ExcelName).xls" href="#" onclick="return ExcellentExport.excel(this, 'excelTable', 'Sheet1');">导出Excel文件</a>
其中excelTable对应table的Id值。
Demo使用源码
@{ Layout = null; ViewBag.Title = "ExcelDemo"; } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>@ViewBag.Title</title> <style> * { margin: 0; padding: 0; } .Data { width: 100%; height: 50px; background-color: #00ffff; text-align: center; font-size: 20px; color: red; line-height: 50px; font-weight: bold; } #report { width: 100%; margin:10px 7%; } .tablereport1 tr:nth-child(2n+1) { background: #e4e4e4; } .tablereport1 td { border: none !important; padding: 0px 10px; height: 40px; text-align: center; } .Down { margin: 10px 5px; line-height: 30px; } .Down a { border: 1px solid #a4a4a4; background-color: #e5e5e5; color: #000; font-size: 14px; text-decoration: none; border-radius: 2px; } </style> <script src="~/Scripts/Excel/excellentexport.js"></script> </head> <body> <div class="Data"> 数据源 </div> <input type="hidden" name="hidTitle" id="hidTitle" value="@ViewBag.ExcelName" /> <div id="report"> <table border="1" class="tablereport1" cellpadding="0" cellspacing="0" id="excelTable"> <tr> <td colspan="5" style="text-align:center;font-size:20px"> 测试数据表 </td> </tr> @for (int i = 1; i < 6; i++) { <tr> @for (int j = 1; j < 5; j++) { <td>行@(i)列@(j)</td> } </tr> } </table> </div> <div class="Data"> 数据导出 </div> <div class="Down"> 用C#将Table里的数据导出到Excel:<br /> @{ Html.RenderAction("Index", "ExportExcel", new { divId = "report", filename = "hidTitle" }); } </div> <div class="Down"> 用js将Table里的数据导出到Excel:<br /> <a download="@(ViewBag.ExcelName).xls" href="#" onclick="return ExcellentExport.excel(this, 'excelTable', 'Sheet1');">导出Excel文件</a> </div> </body> </html>
必须 标签有值 了 才能导出