今天公司项目需要做个导出功能,将jqgrid查询出的数据导出为EXCEL表格文件,期间遇到两个问题:

1.导出报错

uncaught exception: INVALID_CHARACTER_ERR: DOM Exception 5

,原因是插件是老外写的,不支持中文。

2.使用官方的导出代码//$('#jqgrid1').tableExport({ type: 'excel', fileName: new Date().getTime(), escape: 'false' });,导出的EXCEL文件没有表头,并且数据最上方多了一行空白行。

下面我们就来说说怎么处理这两个问题。

首先说一下这个插件下载地址:

Jquery tableExcel.js下载地址:https://github.com/kayalshri/tableExport.jquery.plugin

这个插件功能很强大,支持以下导出格式:

JSON
XML
PNG
CSV
TXT
SQL
MS - Word
Ms - Excel
Ms - Powerpoint
PDF

今天只介绍我在使用此插入导出EXCEL过程中遇到的问题解决方法。

第一个问题解决方法:

打开jquery.base64.js文件,

return {
decode: _decode,

代码上方,添加两个方法,代码如下:

  // private property
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="; // private method for UTF-8 encoding
function utf8Encode(string) {
string = string.replace(/\r\n/g, "\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if ((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
} function encode(input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = utf8Encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
keyStr.charAt(enc1) + keyStr.charAt(enc2) +
keyStr.charAt(enc3) + keyStr.charAt(enc4);
}
return output;
}

然后将代码:

 return {
decode: _decode,
encode: _encode,
VERSION: _VERSION
};

改为:

return {
decode: _decode,
encode: function (str) {
return encode(str);
},
VERSION: _VERSION
};

即可解决。

第二个问题解决办法:

将默认导出代码修改为以下代码:

var tableid = "jq1";
var dd = $("#gbox_" + tableid + ' .ui-jqgrid-htable thead');
var ee = $('#' + tableid);
ee.find('.jqgfirstrow').remove();//干掉多余的无效行
ee.find('tbody').before(dd);//合并表头和表数据
ee.find('tr.ui-search-toolbar').remove();//干掉搜索框
ee.tableExport({ type: 'excel', escape: 'false', fileName: '导出' + new Date().getTime() });
var a = $("#" + tableid).find('thead');//把合并后的表头和数据拆分
$("#gbox_" + tableid + ' .ui-jqgrid-htable').append(a);

参考博客:

通过tableExport.js插件来实现导出Excel/Pdf/txt/json等 - xingyuqihuan的博客 - CSDN博客  https://blog.csdn.net/xingyuqihuan/article/details/79139778

jqgrid实现客户端导出Excel、txt、word、json等数据格式的文件 - 无欲则刚 - CSDN博客  https://blog.csdn.net/qq_29542611/article/details/72657802

导出jqgrid表格数据为EXCEL文件,通过tableExport.js插件。的更多相关文章

  1. 导出网页表格数据为Excel文件的前端解决方案

    在工作中,我们有时会遇到这样的需求,比如:要把页面的表格数据导出为Excel文件.在此记录下自己用的解决方法.代码如下: function tableToExcel(data){ //要导出的数据,t ...

  2. PHP导出MySQL数据到Excel文件

    PHP导出MySQL数据到Excel文件 转载 常会碰到需要从数据库中导出数据到Excel文件,用一些开源的类库,比如PHPExcel,确实比较容易实现,但对大量数据的支持很不好,很容易到达PHP内存 ...

  3. java 写入数据到Excel文件中_Demo

    =======第一版:基本功能实现======= import com.google.common.collect.Maps; import org.apache.log4j.Logger; impo ...

  4. 使用POI导出百万级数据到excel的解决方案

    1.HSSFWorkbook 和SXSSFWorkbook区别 HSSFWorkbook:是操作Excel2003以前(包括2003)的版本,扩展名是.xls,一张表最大支持65536行数据,256列 ...

  5. Python:将爬取的网页数据写入Excel文件中

    Python:将爬取的网页数据写入Excel文件中 通过网络爬虫爬取信息后,我们一般是将内容存入txt文件或者数据库中,也可以写入Excel文件中,这里介绍关于使用Excel文件保存爬取到的网页数据的 ...

  6. 导入数据任务(id:373985)异常, 错误信息:解析导入文件错误,请检查导入文件内容,仅支持导入json格式数据及excel文件

    小程序导入,别人导出的数据库json文件,错误信息如下: 导入数据库失败, Error: Poll error, 导入数据任务(id:373985)异常,错误信息:解析导入文件错误,请检查导入文件内容 ...

  7. c# .Net :Excel NPOI导入导出操作教程之读取Excel文件信息及输出

    c# .Net :Excel NPOI导入导出操作教程之读取Excel文件信息及输出 using NPOI.HSSF.UserModel;using NPOI.SS.UserModel;using S ...

  8. 自动更新开奖数据的excel文件,供大家下载

    自动更新开奖数据的excel文件,供大家下载 2010-03-14 20:22 228492人阅读打印来源:乐彩网 作者:eren 很多人拥有自制excel电子表格,常要更新最基本的开奖信息.如有多期 ...

  9. excel数据 入库mysql 和 mysql数据 导入excel文件

    1.excel数据入库mysql 首先准备excel文件, 标红的地方需要留意,一个是字段名所在行,一个表名对应页: 然后私用mysql工具 navicat, 选择数据库,然后导入文件, 选中相应ex ...

随机推荐

  1. tcp协议下粘包问题的产生及解决方案

    1 tcp有粘包及udp无粘包 - TCP 是面向连接的,面向流的可靠协议:发送端为了将多个发往接收端的包,更有效的发到对方,使用了优化方法(Nagle算法),将多次间隔较小且数据量小的数据, 合并成 ...

  2. oracle数据库实例,数据库的理解

    转自http://www.cnblogs.com/advocate/archive/2010/08/20/1804066.html 加深一下理解 数据库就是一个相片底片 实例就是相纸 一个底片可以冲多 ...

  3. [P1306] 斐波那契公约数 (矩阵快速幂+斐波那契数列)

    一开始数据没加强,一个简单的程序可以拿过 gcd(f[n],f[m])=f[gcd(n,m)] 下面这个是加强数据之后的80分代码 #include<bits/stdc++.h> usin ...

  4. java第一次课

    package java第一周学习2; 达达20173435 信1705-2 import java.text.SimpleDateFormat; import java.util.Date; pub ...

  5. 学习Struts--Chap06:Struts2之数据验证

    1.数据验证的概述 1.1.数据验证的重要性 数据验证是非常必要的,不但和我们的常识性理解有关系,还有可能涉及到一些非法输入等问题,所以我们需要进行必要的数据验证,以保证我们在数据输入的时候都是正确且 ...

  6. AtCoder Regular Contest 080 [CDEF]

    C - 4-adjacent Time limit : 2sec / Memory limit : 256MB Problem Statement We have a sequence of leng ...

  7. 防止APACHE解析漏洞

    一.PHP端,规范代码,加强尾缀验证 二.Apache端,在httpd.conf中加上如下代码: <Files~"\.(p|P)(h|H)(p|P)."> Deny f ...

  8. JS_理解函数参数按值传递

    本文是我基于红宝书<Javascript高级程序设计>中的第四章,4.1.3传递参数小节P70,进一步理解javaSript中函数的参数,当传递的参数是对象时的传递方式. (结合资料的个人 ...

  9. jQuery 学习(1)——认识jQuery

    1.下载 下载地址:http://jquery.com/download/ jquery-3.2.1.js——用于开发和学习(229K) jquery-3.2.1.min.js——用于项目和产品(31 ...

  10. 通过命令“du–sk”, “du–Ask” 的区别,谈谈如何在有保护的文件系统中查看文件或文件夹的大小

    我们都知道,在Windows中,右键单击一个文件或文件夹,选属性(Properties)可以看到这个文件或文件夹的大小.而这个大小是文件的原始大小,即逻辑大小(logical size).即一个1KB ...