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

随机推荐

Jmeter默认报告优化
一.本文目的: 之前写了两篇文章搭建持续集成接口测试平台(Jenkins+Ant+Jmeter)和ANT批量执行Jmeter脚本,功能实现上都没有什么问题,但是最后生成的报告有一点小问题,虽然不影响使 ...
Mac下开启FTPserver
开启命令 sudo -s launchctl load -w /System/Library/LaunchDaemons/ftp.plist 关闭命令 sudo -s launchctl unlo ...
raspberry pi2 智能小车源码及测试视频
作者:XIAOBO QQ:463431476 转载请注明作者Python 源代码 import RPi.GPIO as GPIO #human-computer-interaction import ...
准备使用 Office 365 中国版--安装
温故而知新,先附上一个链接:Office 365常见问题 Office 365中Office套件的安装介质和传统Office套件的安装介质是有些区别的,虽然功能都一样.因此,如果购买了带Office套 ...
IE自动跳转到标准模式
<meta http-equiv="X-UA-Compatible" content="IE=edge">
jquery back to top 页面底部的返回顶部按钮
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
C#基础---扩展方法的应用
最近对扩展方法比较感兴趣,就看了看资料,记录一下扩展方法的几种方法. 一. 扩展方法的基本使用: Note: 1. 扩展方法必须在静态类中, 2 扩展方法必须声明静态方法,3 扩展方法里面不能调用其 ...
30 algorithm questions study
April 26, 2015 Spent over a few months to go over 30 questions about algorithm starting from January ...
UIWrapContent(NGUI长列表优化利器)
NGUI长列表优化利器优化原理 NGUI3.7.x以上版本有个新组件 UIWrapContent ,当我们的列表内容很多时,可以进行优化.它不是一次生成全部的child,而是只有固定数量的chil ...
【Unity】矩阵运算
http://www.cnblogs.com/wywnet/p/3585075.html Vector3: Unity3D中Vector3类定义(只写有用的): 属性: x,y,z ...

将Table表格导出到Excel

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

随机推荐

热门专题