将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等浏览器中无法实现导出效果.经过上网搜索,尝 ...
随机推荐
- JBOSS目录结构详细说明
一.下载与安装. 如何下载以及安装配置,请参考:Windows下JBOSS安装配置图文教程 二.现在主要了解一下JBOSS目录结构. 1. 主目录: E:\jboos\jboss-6.1.0.Fina ...
- Java基础语法总结1
一.标识符及字符集 Java语言规定标识符是以字母.下划线"_"或美元符号"$"开始,随后可跟数字.字母.下划线或美元符号的字符序列.Java标识符大小写敏感, ...
- android AsyncTask实例
.java package com.example.activitydemoay; import android.app.Activity; import android.content.Intent ...
- Linux 下从头再走 GTK+-3.0 (五)
实践中表明,纯粹利用 gtk 函数来创建 UI 是很繁琐的事,需要编写很多代码.怎样才能快速统一的建立 UI 布局呢? 可喜的是 GTK 提供了一个 GtkBuilder 用于快速创建界面.它读取一个 ...
- TeX Live安装配置等默认目录
TeX Live默认目录情况: TEXDIR (the main TeX directory): !! default location: /usr/local/texlive/2015 ...
- SpringMVC从入门到精通之第四章
第一个知识点:@Controller注解,用于标识这个类是一个后端控制器(类似struts中的action),主要作用就是接受页面的参数,转发页面.中间的业务逻辑是调用业务类处理的这个就是MVC设计模 ...
- Codeforces Round #283 Div.2 D Tennis Game --二分
题意: 两个人比赛,给出比赛序列,如果为1,说明这场1赢,为2则2赢,假如谁先赢 t 盘谁就胜这一轮,谁先赢 s 轮则赢得整个比赛.求有多少种 t 和 s 的分配方案并输出t,s. 解法: 因为要知道 ...
- OpenSessionInview
Open Session In View模式的主要思想是:在用户的每一次请求过程始终保持一个Session对象打开着 实现步骤: 步骤一.创建一个Web项目,创建包cn.happy.util,创建Hi ...
- GNU make简要介绍①指定变量、自动推导规则、清除工作目录过程文件
Makefile简介 在执行make之前需要一个命名为Makefile的特殊文件来告诉make需要做些什么. 当使用 make 工具进行编译时,工程中以下几种文件在执行 make 时将会被编译 (重新 ...
- poj 2481
Cows Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 16163 Accepted: 5380 Description ...