直入主題: css
需求:從數據集中出去檢索的數據,生成Excel ,轉成HTML table 顯示在頁面上。還能夠導出Excel .html
我實現的效果圖: node
頁面---->ajax
Excel---->bootstrap
now ,說下具體的代碼:瀏覽器
一、添加組件:app
NPOI 相關組件,Excel轉HTML組件。ide
二、使用了bootstrap 樣式,全部要記得引用post
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="Script/jQuery-2.1.4.min.js"></script> <link href="bootstrap-3.3.5-dist/css/bootstrap.css" rel="stylesheet" /> <script src="bootstrap-3.3.5-dist/js/bootstrap.js"></script> <script src="Script/Main.js"></script> <script src="Script/FixTable.js"></script> <script src="bootstrap-3.3.5-dist/js/extendPagination.js"></script> </head> <body> <button class="btn btn-primary" type="button" id="Searchbtn">Search</button> <button class="btn btn-primary" type="button" id="Exportbtn">Export</button> <div id="reportpan" style=""> <table id="CountReport" class=" display table-bordered table-hover" style="overflow-x: scroll; white-space: nowrap; text-align: center !important; color: #000000;" cellspacing="0"></table> <div style="text-align: right;"> <div id="CallBackPager"></div> </div> </div> </body> </html>
三、script ui
LoadData(false); var isref = true; $(document).ready(function () { $("#Searchbtn").click(function () { isref = true; LoadData(false); }); $("#Exportbtn").click(function () { $.dynamicSubmit("GetDataHandler.ashx", { pDistrict: "" }); }); }); function LoadData(op) { var pagesize = 10; var pageindex = 1; if (op) { var cupageindex = $("#CallBackPager li[class='active'] a"); if (cupageindex.length != 0) { pageindex = parseInt(cupageindex[0].innerHTML); } } $.ajax({ data: { Pindex: pageindex, Psize: pagesize }, type: "POST", url: "GetDataHandler.ashx", // cache: false, datatype: "text", success: function (data) { if (data != "") { var ret = data.split("●"); if (ret.length = 2) { $("#CountReport").html(ret[1] + "<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>"); $("#CountReport tr td ").css("padding", "3"); $("#CountReport tr:eq(0)").css("font-size", "14px").css("font-weight", "700"); // $("#CountReport tr:eq(1)").css("font-size", "14px").css("font-weight", "700"); // font-size:14px;font-weight:700 var width = $("#reportpan").width; var height = $("#reportpan").height() + 20; FixTable("CountReport", 5, width, height); var totalCount = parseInt(ret[0]); if (isref) { $('#CallBackPager').extendPagination({ totalCount: totalCount, showCount: 5, limit: pagesize, callback: function (curr, limit, totalCount) { LoadData(true); } }); isref = false; } } } } }); } $.dynamicSubmit = function (url, datas) { var form = $('#dynamicForm'); if (form.length <= 0) { form = $("<form>"); form.attr('id', 'dynamicForm'); form.attr('style', 'display:none'); form.attr('target', ''); form.attr('method', 'post'); form.attr('enctype', 'multipart/form-data'); $('body').append(form); } form = $('#dynamicForm'); form.attr('action', url); form.empty(); if (datas && typeof (datas) == 'object') { for (var item in datas) { var $_input = $('<input>'); $_input.attr('type', 'hidden'); $_input.attr('name', item); $_input.val(datas[item]); $_input.appendTo(form); } } form.submit(); }
四、這裏使用了通常處理程序作的實例,so . .. 添加通常處理程序。
public class GetDataHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string str = context.Request["Psize"]; CreateExcel createexcel = new CreateExcel(); if (!string.IsNullOrEmpty(str)) { int psize = Convert.ToInt32(context.Request["Psize"]); int pindex = Convert.ToInt32(context.Request["Pindex"]); int TotalCount = 0; IWorkbook wb = createexcel.GetIWorkbook(psize, pindex, out TotalCount); string html = XLSConvertToHtml(wb); HtmlDocument doc = new HtmlDocument(); doc.LoadHtml(html); HtmlNode node = doc.DocumentNode; HtmlNode tbody = node.SelectSingleNode("//table/tbody"); string htmlstring = ""; if (tbody != null) { htmlstring = tbody.InnerHtml; } context.Response.Write(TotalCount.ToString() + "●" + htmlstring); } else { int TotalCount = 0; IWorkbook wb = createexcel.GetIWorkbook(0, 0, out TotalCount); MemoryStream stream = new MemoryStream(); wb.Write(stream); string filename = DateTime.Now.ToString("yyyy-MM-dd") + ".xls"; stream.Seek(0, SeekOrigin.Begin); // return File(stream, "application/vnd.ms-excel", "HeadcountByModality" + DateTime.Now.ToString("yyyy-MM-dd") + ".xls"); MVC 中 context.Response.Clear(); context.Response.Charset = "GB2312"; context.Response.ContentEncoding = System.Text.Encoding.UTF8; // 添加頭信息,爲"文件下載/另存爲"對話框指定默認文件名, 設定編碼爲UTF8,防止中文文件名出現亂碼 context.Response.AddHeader("Content-Disposition", "attachment; filename=" + filename); // 添加頭信息,指定文件大小,讓瀏覽器可以顯示下載進度 context.Response.AddHeader("Content-Length", stream.Length.ToString()); //// 指定返回的是一個不能被客戶端讀取的流,必須被下載 // context.Response.ContentType = "application/ms-excel"; // 把文件流發送到客戶端 context.Response.BinaryWrite(stream.ToArray()); // 中止頁面的執行 context.Response.End(); } } public string XLSConvertToHtml(IWorkbook workbook) { ExcelToHtmlConverter excelToHtmlConverter = new ExcelToHtmlConverter(); //set output parameter excelToHtmlConverter.OutputColumnHeaders = false; excelToHtmlConverter.OutputHiddenColumns = false; excelToHtmlConverter.OutputHiddenRows = false; excelToHtmlConverter.OutputLeadingSpacesAsNonBreaking = false; excelToHtmlConverter.OutputRowNumbers = false; excelToHtmlConverter.UseDivsToSpan = false; //process the excel file excelToHtmlConverter.ProcessWorkbook(workbook); //output the html file return excelToHtmlConverter.Document.InnerXml; } public bool IsReusable { get { return false; } } }
五、爲了方便,將一些代碼合併到了一個類。
public class CreateExcel { public IWorkbook GetIWorkbook(int pagesize, int pagenum, out int TotalCount) { int Start = (pagenum - 1) * pagesize + 1; TotalCount = 0; IWorkbook wb = new HSSFWorkbook(); //建立表 ISheet sh = wb.CreateSheet("放射培訓及工做證彙總表"); // sh.ForceFormulaRecalculation = true; int heard = 1; #region 設置表頭 IRow row1 = sh.CreateRow(0); row1.Height = 20 * 20; ICell icell1top = row1.CreateCell(0); // icell1top.CellStyle = Getcellstyle(wb, stylexls.默認); icell1top.SetCellValue("序號"); ICell icell2top = row1.CreateCell(1); // icell2top.CellStyle = Getcellstyle(wb, stylexls.默認); icell2top.SetCellValue("大區"); ICell icelltop = row1.CreateCell(2); // icell2top.CellStyle = Getcellstyle(wb, stylexls.默認); icelltop.SetCellValue("城市"); ICell icell3top = row1.CreateCell(3); // icell3top.CellStyle = Getcellstyle(wb, stylexls.默認); icell3top.SetCellValue("員工號"); ICell icell4top = row1.CreateCell(4); // icell4top.CellStyle = Getcellstyle(wb, stylexls.默認); icell4top.SetCellValue("姓名"); ICell icell5top = row1.CreateCell(5); // icell5top.CellStyle = Getcellstyle(wb, stylexls.默認); icell5top.SetCellValue("性別"); ICell icell6top = row1.CreateCell(6); // icell6top.CellStyle = Getcellstyle(wb, stylexls.默認); icell6top.SetCellValue("身份證號"); ICell icell7top = row1.CreateCell(7); // icell7top.CellStyle = Getcellstyle(wb, stylexls.默認); icell7top.SetCellValue("聯繫方式"); ICell icell8top = row1.CreateCell(8); // icell8top.CellStyle = Getcellstyle(wb, stylexls.默認); icell8top.SetCellValue("郵件地址"); ICell icell9top = row1.CreateCell(9); // icell9top.CellStyle = Getcellstyle(wb, stylexls.默認); icell9top.SetCellValue("主管經理"); ICell icell10top = row1.CreateCell(10); // icell10top.CellStyle = Getcellstyle(wb, stylexls.默認); icell10top.SetCellValue("成本中心"); ICell icell11top = row1.CreateCell(11); // icell11top.CellStyle = Getcellstyle(wb, stylexls.默認); icell11top.SetCellValue("產品線"); ICell icell12top = row1.CreateCell(12); // icell12top.CellStyle = Getcellstyle(wb, stylexls.默認); icell12top.SetCellValue("崗位"); ICell icell13top = row1.CreateCell(13); // icell13top.CellStyle = Getcellstyle(wb, stylexls.默認); icell13top.SetCellValue("在職狀態"); ICell icell14top = row1.CreateCell(14); // icell14top.CellStyle = Getcellstyle(wb, stylexls.默認); icell14top.SetCellValue("離職時間"); ICell icell15top = row1.CreateCell(15); // icell15top.CellStyle = Getcellstyle(wb, stylexls.默認); icell15top.SetCellValue("入職時間"); ICell icell16top = row1.CreateCell(16); // icell16top.CellStyle = Getcellstyle(wb, stylexls.默認); icell16top.SetCellValue("崗位轉入"); ICell icell17top = row1.CreateCell(17); // icell17top.CellStyle = Getcellstyle(wb, stylexls.默認); icell17top.SetCellValue("崗位轉出"); #endregion #region 數據 List<XmlNode> nodelist = GetData(pagesize, pagenum, out TotalCount); XmlNode node; for (int i = 0; i < nodelist.Count; i++) { node = nodelist[i]; IRow irow = sh.CreateRow(i + 1); //序號 ICell icell = irow.CreateCell(0); icell.SetCellValue(Start + i); //大區 icell = irow.CreateCell(1); icell.SetCellValue(node.SelectSingleNode("District").InnerText); //城市 icell = irow.CreateCell(2); icell.SetCellValue(node.SelectSingleNode("City").InnerText); //員工號 icell = irow.CreateCell(3); icell.SetCellValue(node.SelectSingleNode("StaffID").InnerText); //姓名 icell = irow.CreateCell(4); icell.SetCellValue(node.SelectSingleNode("CName").InnerText); //性別 icell = irow.CreateCell(5); icell.SetCellValue(node.SelectSingleNode("Gender").InnerText); //身份證號 icell = irow.CreateCell(6); icell.SetCellValue(node.SelectSingleNode("IDNo").InnerText); //聯繫方式 icell = irow.CreateCell(7); icell.SetCellValue(node.SelectSingleNode("Mobile").InnerText); //郵件地址 icell = irow.CreateCell(8); icell.SetCellValue(node.SelectSingleNode("Email").InnerText); //主管經理 icell = irow.CreateCell(9); icell.SetCellValue(node.SelectSingleNode("LMEmail").InnerText); //成本中心 icell = irow.CreateCell(10); icell.SetCellValue(node.SelectSingleNode("CostCenter").InnerText); //產品線 icell = irow.CreateCell(11); icell.SetCellValue(node.SelectSingleNode("Modality").InnerText); //崗位 icell = irow.CreateCell(12); icell.SetCellValue(node.SelectSingleNode("Position").InnerText); //在職狀態 icell = irow.CreateCell(13); icell.SetCellValue(node.SelectSingleNode("Status").InnerText); //離職時間 icell = irow.CreateCell(14); icell.SetCellValue(node.SelectSingleNode("JoinDate").InnerText); //入職時間 icell = irow.CreateCell(15); icell.SetCellValue(node.SelectSingleNode("JoinDate").InnerText); //轉入崗位 icell = irow.CreateCell(16); icell.SetCellValue(node.SelectSingleNode("Position").InnerText); //轉出崗位 icell = irow.CreateCell(17); icell.SetCellValue(node.SelectSingleNode("Position").InnerText); } #endregion return wb; } public List<XmlNode> GetData(int pagesize, int pagenum, out int TotalCount) { XmlDocument DataXML = GetXML(); XmlNodeList nodelist = DataXML.SelectNodes("UserList/user"); TotalCount = nodelist.Count; int start = 0; int end = 0; if (pagesize != 0) { start = (pagenum - 1) * pagesize; end = pagenum * pagesize > TotalCount ? TotalCount : pagenum * pagesize; } else { end = TotalCount; } List<XmlNode> xmlnodelist = new List<XmlNode>(); for (int i = start; i < end; i++) { xmlnodelist.Add(nodelist[i]); } return xmlnodelist; } public XmlDocument GetXML() { XmlDocument DataXML = new XmlDocument(); string filepath = AppDomain.CurrentDomain.BaseDirectory + "User.xml"; if (File.Exists(filepath)) { DataXML.Load(filepath); } return DataXML; } }
六、特別說明。這個實例是與其餘寫在一塊兒的,可能有部分代碼不須要。此次時間倉促。