实现easyui的datagrid导出为excel的示例代码


Posted in Javascript onNovember 10, 2016

之前有介绍过如何实现easyui里datagrid内容的打印,今天给大家介绍下如何实现datagrid内容导出为excel文件。以下为代码实现:

export.js

function ChangeToTable(printDatagrid) {
  var tableString = '<table cellspacing="0" class="pb">';
  var frozenColumns = printDatagrid.datagrid("options").frozenColumns; // 得到frozenColumns对象
  var columns = printDatagrid.datagrid("options").columns;  // 得到columns对象
  var nameList = new Array();

  // 载入title
  if (typeof columns != 'undefined' && columns != '') {
    $(columns).each(function (index) {
      tableString += '\n<tr>';
      if (typeof frozenColumns != 'undefined' && typeof frozenColumns[index] != 'undefined') {
        for (var i = 0; i < frozenColumns[index].length; ++i) {
          if (!frozenColumns[index][i].hidden) {
            tableString += '\n<th width="' + frozenColumns[index][i].width + '"';
            if (typeof frozenColumns[index][i].rowspan != 'undefined' && frozenColumns[index][i].rowspan > 1) {
              tableString += ' rowspan="' + frozenColumns[index][i].rowspan + '"';
            }
            if (typeof frozenColumns[index][i].colspan != 'undefined' && frozenColumns[index][i].colspan > 1) {
              tableString += ' colspan="' + frozenColumns[index][i].colspan + '"';
            }
            if (typeof frozenColumns[index][i].field != 'undefined' && frozenColumns[index][i].field != '') {
              nameList.push(frozenColumns[index][i]);
            }
            tableString += '>' + frozenColumns[0][i].title + '</th>';
          }
        }
      }
      for (var i = 0; i < columns[index].length; ++i) {
        if (!columns[index][i].hidden) {
          tableString += '\n<th width="' + columns[index][i].width + '"';
          if (typeof columns[index][i].rowspan != 'undefined' && columns[index][i].rowspan > 1) {
            tableString += ' rowspan="' + columns[index][i].rowspan + '"';
          }
          if (typeof columns[index][i].colspan != 'undefined' && columns[index][i].colspan > 1) {
            tableString += ' colspan="' + columns[index][i].colspan + '"';
          }
          if (typeof columns[index][i].field != 'undefined' && columns[index][i].field != '') {
            nameList.push(columns[index][i]);
          }
          tableString += '>' + columns[index][i].title + '</th>';
        }
      }
      tableString += '\n</tr>';
    });
  }
  // 载入内容
  var rows = printDatagrid.datagrid("getRows"); // 这段代码是获取当前页的所有行
  for (var i = 0; i < rows.length; ++i) {
    tableString += '\n<tr>';
    for (var j = 0; j < nameList.length; ++j) {
      var e = nameList[j].field.lastIndexOf('_0');

      tableString += '\n<td';
      if (nameList[j].align != 'undefined' && nameList[j].align != '') {
        tableString += ' style="text-align:' + nameList[j].align + ';"';
      }
      tableString += '>';
      if (e + 2 == nameList[j].field.length) {
        tableString += rows[i][nameList[j].field.substring(0, e)];
      }
      else
        tableString += rows[i][nameList[j].field];
      tableString += '</td>';
    }
    tableString += '\n</tr>';
  }
  tableString += '\n</table>';
  return tableString;
}

function Export(strXlsName, exportGrid) {
  var f = $('<form action="/export.aspx" method="post" id="fm1"></form>');
  var i = $('<input type="hidden" id="txtContent" name="txtContent" />');
  var l = $('<input type="hidden" id="txtName" name="txtName" />');
  i.val(ChangeToTable(exportGrid));
  i.appendTo(f);
  l.val(strXlsName);
  l.appendTo(f);
  f.appendTo(document.body).submit();
  document.body.removeChild(f);
}

export.aspx

protected void Page_Load(object sender, EventArgs e)
    {
      Response.Clear();
      Response.Buffer = true;
      Response.Charset = "utf-8";
      Response.ContentEncoding = System.Text.Encoding.UTF8;
      Response.AppendHeader("content-disposition", "attachment;filename=\"" + HttpUtility.HtmlEncode(Request["txtName"]??DateTime.Now.ToString("yyyyMMdd")) + ".xls\"");
      Response.ContentType = "Application/ms-excel";
      Response.Write("<html>\n<head>\n");
      Response.Write("<style type=\"text/css\">\n.pb{font-size:13px;border-collapse:collapse;} "+
              "\n.pb th{font-weight:bold;text-align:center;border:0.5pt solid windowtext;padding:2px;} " +
              "\n.pb td{border:0.5pt solid windowtext;padding:2px;}\n</style>\n</head>\n");
      Response.Write("<body>\n" + Request["txtContent"] + "\n</body>\n</html>");
      Response.Flush();
      Response.End(); 
    }

其中export.aspx为了防止前台页面内容干扰,前台页面只留:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="export.aspx.cs" Inherits="newland.WebUI.export" ValidateRequest="false" %>

这句话,其他的全部删除。

调用方法:

<a href="javascript:void(0);" onclick="Export('导出excel', $('#grid'));">导出</a>

以上就是小编为大家带来的实现easyui的datagrid导出为excel的示例代码全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
JS加ASP二级域名转向的代码
May 17 Javascript
JavaScript之引用类型介绍
Aug 10 Javascript
node.js中的fs.appendFileSync方法使用说明
Dec 17 Javascript
jquery移动点击的项目到列表最顶端的方法
Jun 24 Javascript
基于jQuery实现的扇形定时器附源码下载
Oct 20 Javascript
jQuery实现按钮点击遮罩加载及处理完后恢复的效果
Jun 07 Javascript
ES6字符串模板,剩余参数,默认参数功能与用法示例
Apr 06 Javascript
解决循环中setTimeout执行顺序的问题
Jun 20 Javascript
从零开始实现Vue简单的Toast插件
Dec 03 Javascript
微信小程序从注册账号到上架(图文详解)
Jul 17 Javascript
Javascript基于OOP实实现探测器功能代码实例
Aug 26 Javascript
微信小程序自定义modal弹窗组件的方法详解
Dec 20 Javascript
easyui导出excel无法弹出下载框的快速解决方法
Nov 10 #Javascript
VueJS全面解析
Nov 10 #Javascript
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
Nov 10 #Javascript
easyui中combotree循环获取父节点至根节点并输出路径实现方法
Nov 10 #Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
Nov 09 #Javascript
通过bootstrap全面学习less
Nov 09 #Javascript
DataTables+BootStrap组合使用Ajax来获取数据并且动态加载dom的方法(排序,过滤,分页等)
Nov 09 #Javascript
You might like
Win2003下APACHE+PHP5+MYSQL4+PHPMYADMIN 的简易安装配置
2006/11/18 PHP
基于PHP文件操作的详解
2013/06/05 PHP
php学习笔记之基础知识
2014/11/08 PHP
PHP抽奖算法程序代码分享
2015/10/08 PHP
深入了解PHP中的Array数组和foreach
2016/11/06 PHP
PHP时间处理类操作示例
2018/09/05 PHP
php给数组赋值的实例方法
2019/09/26 PHP
jquery 分页控件实现代码
2009/11/30 Javascript
jquery.validate.js插件使用经验记录
2014/07/02 Javascript
jQuery+ajax中getJSON() 用法实例
2014/12/22 Javascript
学习JavaScript事件流和事件处理程序
2016/01/25 Javascript
通过隐藏iframe实现无刷新上传文件操作
2016/03/16 Javascript
Bootstrap实现带动画过渡的弹出框
2016/08/09 Javascript
Jquery循环截取字符串的方法(多出的字符串处理成&quot;...&quot;)
2016/11/28 Javascript
jq.ajax+php+mysql实现关键字模糊查询(示例讲解)
2018/01/02 Javascript
Angular2整合其他插件的方法
2018/01/20 Javascript
[02:38]2018DOTA2亚洲邀请赛赛前采访-VGJ.T
2018/04/03 DOTA
[48:56]2018DOTA2亚洲邀请赛 3.31 小组赛 A组 VG vs KG
2018/03/31 DOTA
[02:37]2018DOTA2亚洲邀请赛赛前采访 VP.no[o]ne心中最强SOLO是谁
2018/04/04 DOTA
python导入csv文件出现SyntaxError问题分析
2017/12/15 Python
Python中xrange与yield的用法实例分析
2017/12/26 Python
python实现逆序输出一个数字的示例讲解
2018/06/25 Python
Python类和对象的定义与实际应用案例分析
2018/12/27 Python
对Pyhon实现静态变量全局变量的方法详解
2019/01/11 Python
python实现QQ空间自动点赞功能
2019/04/09 Python
python飞机大战pygame游戏框架搭建操作详解
2019/12/17 Python
keras 多任务多loss实例
2020/06/22 Python
python进行二次方程式计算的实例讲解
2020/12/06 Python
灵泰克Java笔试题
2016/01/09 面试题
2014信息公开实施方案
2014/02/22 职场文书
《雪地里的小画家》教学反思
2014/02/22 职场文书
2014年银行年终工作总结
2014/12/19 职场文书
团委工作总结2015
2015/04/02 职场文书
2016元旦主持人经典开场白台词
2015/12/03 职场文书
《玩出了名堂》教学反思
2016/02/17 职场文书
基于flask实现五子棋小游戏
2021/05/25 Python