将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等浏览器中无法实现导出效果.经过上网搜索,尝 ...

随机推荐

oracle学习笔记系列------oracle操作例子的专用表
CREATE TABLE dept( deptno ), dname ) , loc ) ) ; CREATE TABLE emp( empno ), ename ), job ), mgr ), h ...
Linux多进程编程
进程的状态 Linux进程有7种基础状态(两种running算一种),除了traced都可以用$ps命令查看,$ps可以查看的进程状态如下,更多进程状态信息参见Linux Process VS Thr ...
POI读写Word docx文件
使用POI读写word docx文件目录 1 读docx文件 1.1 通过XWPFWordExtractor读 1.2 通过XWPFDocument读 2 写docx ...
MMORPG大型游戏设计与开发（客户端架构 part1 of vegine）
重写有些核心接口的时候,其实遇到了许多的问题,甚至一度的想过要放弃,但是最终还是坚持了下来.在客户端提供的这些接口中,可以清晰的看到客户端所依赖的各种模块的支持,以及各自之间的一些关联.下面只是介绍了 ...
java设计模式之抽象工厂模式
上一篇文章(http://www.cnblogs.com/liaoweipeng/p/5768197.html)讲了简单工厂模式,但是简单工厂模式存在一定的问题,如果想要拓展程序,必须对工厂类进行修改 ...
Stanford机器学习笔记-9. 聚类(Clustering)
9. Clustering Content 9. Clustering 9.1 Supervised Learning and Unsupervised Learning 9.2 K-means al ...
Java的cmd配置（也即Java的JDK配置及相关常用命令）——找不到或无法加载主类的解决方法
Java的cmd配置(也即Java的JDK配置及相关常用命令) ——找不到或无法加载主类的解决方法这段时间一直纠结于cmd下Java无法编译运行的问题.主要问题描述如下: javac 命令可以正 ...
$(window).load(function() {})和$(document).ready(function(){})的区别
JavaScript 中的以下代码 : Window.onload = function (){// 代码 } 等价于 Jquery 代码如下: $(window).load(function ( ...
java 继承（下）
1.抽象方法一定要写在抽象类中. 2.抽象类只在描述该事事务应该具备的东西. 3.抽象只能是抽象类和抽象方法. 4,抽象类没有任何抽象方法,这种类是不让创建对象. private static
oracle 事务总结
用了这么长时间的oracle,该总结一下所得了 1,事务事务用于保证数据的一致性, 它由一组相关的 dml语句组成, 该组的dml(数据操作语言,增删改,没有查询)语句要么全部成功,要么全部失败,比 ...

将Table表格导出到Excel

将Table表格导出到Excel的更多相关文章

随机推荐

热门专题