将Table表格导出到Excel
1.导出当前页
效果如下:
前台代码:
@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<style>
DIV.viciao {
MARGIN-TOP: 20px;
MARGIN-BOTTOM: 10px;
} DIV.viciao A {
BORDER-RIGHT: #8db5d7 1px solid;
PADDING-RIGHT: 5px;
BORDER-TOP: #8db5d7 1px solid;
PADDING-LEFT: 5px;
PADDING-BOTTOM: 2px;
BORDER-LEFT: #8db5d7 1px solid;
COLOR: #;
MARGIN-RIGHT: 2px;
PADDING-TOP: 2px;
BORDER-BOTTOM: #8db5d7 1px solid;
TEXT-DECORATION: none;
} DIV.viciao A:hover {
BORDER-RIGHT: red 1px solid;
PADDING-RIGHT: 5px;
BORDER-TOP: red 1px solid;
PADDING-LEFT: 5px;
PADDING-BOTTOM: 2px;
BORDER-LEFT: red 1px solid;
MARGIN-RIGHT: 2px;
PADDING-TOP: 2px;
BORDER-BOTTOM: red 1px solid;
} DIV.viciao A:active {
BORDER-RIGHT: red 1px solid;
PADDING-RIGHT: 5px;
BORDER-TOP: red 1px solid;
PADDING-LEFT: 5px;
PADDING-BOTTOM: 2px;
BORDER-LEFT: red 1px solid;
MARGIN-RIGHT: 2px;
PADDING-TOP: 2px;
BORDER-BOTTOM: red 1px solid;
} DIV.viciao SPAN.current {
BORDER-RIGHT: #e89954 1px solid;
PADDING-RIGHT: 5px;
BORDER-TOP: #e89954 1px solid;
PADDING-LEFT: 5px;
FONT-WEIGHT: bold;
PADDING-BOTTOM: 2px;
BORDER-LEFT: #e89954 1px solid;
COLOR: #;
MARGIN-RIGHT: 2px;
PADDING-TOP: 2px;
BORDER-BOTTOM: #e89954 1px solid;
BACKGROUND-COLOR: #ffca7d;
} DIV.viciao SPAN.disabled {
BORDER-RIGHT: #ccc 1px solid;
PADDING-RIGHT: 5px;
BORDER-TOP: #ccc 1px solid;
PADDING-LEFT: 5px;
PADDING-BOTTOM: 2px;
BORDER-LEFT: #ccc 1px solid;
COLOR: #ccc;
MARGIN-RIGHT: 2px;
PADDING-TOP: 2px;
BORDER-BOTTOM: #ccc 1px solid;
} </style>
</head>
<body>
<input type="button" name="excelBut" value="导出Excel" onclick="exportExcel()" class="sgbtn" /> <table id="OrderInfo">
<thead>
<tr>
<th>编号</th>
<th>姓名</th>
<th>备注</th>
</tr>
</thead>
<tbody id="tdContent"></tbody>
</table>
<div id="nav" class="viciao"></div>
<!--导出Excel处理隐藏域-->
@using (Html.BeginForm("ExportExcel1", "Home", FormMethod.Post, new { name = "myForm" }))
{
@Html.Hidden("hHtml")
} <script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script>
//分页内容开始
$(function () {
pageData(,);
})
pageData = function (pIndex, pSize) {
$("#tdContent").empty();
$("#nav").children().empty();
$.getJSON('@Url.Action("GetList","Home")?id='+Math.random()+'', { pageIndex: pIndex,pageSize:pSize}, function (_data) {
for (var i = ; i < _data.data.length; i++) {
var html = "<tr><td name='majorId'>" + _data.data[i].MajorID + "</td><td>" + _data.data[i].Name + "</td><td>" + _data.data[i].Remark + "</td></tr>";
$("#tdContent").append(html);
}
$("<p id='pNav'>" + _data.strPage + "</p>").appendTo("#nav");
$("#pNav a").click(clickShow);
})
}
function clickShow() { var url = this.href;
var navData = url.substring(url.lastIndexOf('?') + );
var pSize = navData.split('&')[].split('=')[];
var pIndex = navData.split('&')[].split('=')[];
pageData(pIndex, pSize);
return false;
}
//分页内容结束-------<< //导出Excel文件开始
function exportExcel() {
var sHtml =htmlEncode($("#OrderInfo")[].outerHTML);//做html编码
$("input[name='hHtml']").val(sHtml); //表单提交
$("form[name='myForm']").submit();
} function htmlEncode(value) {
return $('<div/>').text(value).html();
}
//导出Excel文件结束
</script>
</body>
</html>
后台代码:
using Entity.Models;
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using NPOI.HSSF.UserModel;
using NPOI.HPSF;
using NPOI.POIFS.FileSystem;
using System.IO;
using System.Text.RegularExpressions; namespace 分页练习.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/ public ActionResult Index()
{ return View();
}
public ActionResult GetList()
{
int pageIndex = string.IsNullOrEmpty(Request["pageIndex"]) ? :int.Parse(Request["pageIndex"]);
int pageSize = string.IsNullOrEmpty(Request["pageSize"]) ? : int.Parse(Request["pageSize"]);
DbContext db = new InfernoContext();
int recordCount=db.Set<Major>().Count();
int pageCount = Convert.ToInt32(Math.Ceiling((recordCount*1.0/pageSize)));
List<Major> list=db.Set<Major>().OrderBy(c => c.MajorID).Skip((pageIndex - ) * pageSize).Take(pageSize).ToList();
string strPage = PageHelper.strPage(recordCount, pageSize, pageCount, pageIndex,"../Home/Index?pageSize="+pageSize+"&pageIndex=");
var sendData = new{data=list,strPage=strPage };
return Json(sendData, JsonRequestBehavior.AllowGet);
}
/// <summary>
/// 导出Excel
/// </summary>
[HttpPost]
public ActionResult ExportExcel1(FormCollection form)
{
string strHtml = form["hHtml"];
strHtml = HttpUtility.HtmlDecode(strHtml);//Html解码
byte[] b = System.Text.Encoding.UTF8.GetBytes(strHtml);//字串转byte阵列 return File(b, "application/vnd.ms-excel", "订单详情.xls");//输出档案给Client端
} }
}
导出Excel动态链接库下载:http://pan.baidu.com/s/1o7ZDxwu
PS:上面是导出【当前页】的内容,如果想导出【所有的】。原理一样,添加个隐藏域就行了,然后将所有查询到的值加载到这个隐藏域里面。之后就可以按照上面的方法继续啦~
关于将Excel导入数据库可以参考博文
终结版参考博文
将Table表格导出到Excel的更多相关文章
- 纯JS 将table表格导出到excel
html <div > <button type="button" onclick="getXlsFromTbl('tableExcel','myDiv ...
- vue+iview中的table表格导出excel表格
一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...
- 将HTML表格导出到EXCEL,兼容Firefox,支持中文
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 使用JavaScript把页面上的表格导出为Excel文件
如果在页面上展示了一个数据表格,而用户想把这个表格导出为Excel文件,那么在要求不高的情况下,可以不通过服务器生成表格,而是直接利用JavaScript的Blob和Object URL特性将表格导出 ...
- 网站开发进阶(二十五)js如何将html表格导出为excel文件
js如何将html表格导出为excel文件 赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...
- vue将表格导出为excel
vue将表格导出为excel 一:在项目中需要安装2个依赖项,如下命令: npm install --save file-saver xlsx 二:在vue文件中如下使用即可: <templat ...
- JS 将页面上的表格导出为 Excel 文件
如果在页面上展示了一个表格,想把这个表格导出为Excel文件,那么在要求不高的情况下,可以直接利用 JavaScript 的 Blob 和 Object URL 特性将表格导出.不过,这就是利用了 E ...
- 使用NPOI将TABLE内容导出到EXCEL
项目中需要将页面中的table内容导出到EXCEL,在用了几种方法后发现NPO是最快&最好的 需要应用 NPOI.dll 还有个Ionic.Zip.dll不知道有用没,没去研究,两个DLL都放 ...
- 网站开发进阶(三十一)js如何将html表格导出为excel文件(后记)
js如何将html表格导出为excel文件(后记) 前言 项目前期做了个导出Excel表格的功能,但是经过测试发现只有在IE上才可以正确实现,在Chrome等浏览器中无法实现导出效果.经过上网搜索,尝 ...
随机推荐
- lsattr, chattr
lsattr $lsattr #查看文件的隐藏属性 $lsattr -------------e- ./bookmarks-2016-10-11.json -------------e- ./rxvt ...
- Linux IPC System V 消息队列
模型 #include <sys/types.h> #include <sys/ipc.h> #include <sys/msg.h> ftok() //获取key ...
- IIS 500.19 错误
HTTP 错误 500.19 - Internal Server Error 错误代码 0x80070021 配置错误 不能在此路径中使用此配置节.如果在父级别上锁定了该节,便会出现这种情况.锁定是默 ...
- Linux磁盘管理之日志文件系统和非日志文件系统08
略. 查看linux支持的文件系统命令: ls /lib/module/`uname -r`/x86/fs blkid查看文件系统的类型 mkfs.ext2 == mkfs –t ext2
- android 导入数据(通讯录)
接着android 中导出数据 一文,下面介绍在android中导入数据的思路: 1.将数据从文本中读取出来 2.封装处理成自己想要的对象或模型 3.将处理好的数据对象插入自己应用的数据库中 4.更新 ...
- 004.UDP--拼接UDP数据包,构造ip头和udp头通信(使用原始套接字)
一.大致流程: 建立一个client端,一个server端,自己构建IP头和UDP头,写入数据(hello,world!)后通过原始套接字(SOCK_RAW)将包发出去. server端收到数据后,打 ...
- HDU 4866 Shooting(持久化线段树)
view code//第二道持久化线段树,照着别人的代码慢慢敲,还是有点不理解 #include <iostream> #include <cstdio> #include & ...
- PHP读取超大文件的实例代码
数据量大带来的问题就是单个文件很大,能够打开这个文件相当不容易,记事本就不要指望了,果断死机 去年年底的各种网站帐号信息的数据库泄漏,很是给力啊,趁机也下载了几个数据库,准备学学数据分析家来分析一 ...
- FineReport报表系统实例方案之医院院长查询分析系统
医院院长查询系统 目前,大中型医院的信息处理正从传统手工方式飞速向电脑信息化建设方案转变,一个大中型医院担负着繁重的医疗和科研任务,以及繁杂的事务性工作,院长必须时刻与各科室保持密切的连续,以便随时了 ...
- jquery——九宫格大转盘抽奖
一.用到的图片 二.代码如下,重点是js部分 <!DOCTYPE html> <html> <head> <meta http-equiv="Con ...