有关ExtGrid导出Excel的实现方式,网上已经有很多,官方也给出了一个方案,代码不是很完善,不过已经有高人对这个进行了修正。具体实现方式及代码我这里就不再多说了,大家可以参看:http://www.dojochina.com/index.php?q=node/1254,附件:gridToExcel.js。其基本思想是:客户端根据Grid数据生成Excel格式的XML数据,然后发送到一个服务端文件,服务端文件通过设定Content-Type来实现Excel的下载。
例子中服务端使用的PHP,这段代码在PHP中可能可以很好的工作,但是如果到了JSP等环境下,就出现了问题,导出数据可能是空。问题出在哪里呢?上面这部分代码中的ajax提交其实并不是真正的ajax提交,因为ajax提交是在后台执行,因此不可能实现下载,可以看到这里有form和isUpload两个参数:Ext的ajax请求中如果配置了isUpload:true,则其ajax就不是真正的ajax请求,而是通过创建一个隐藏的Iframe,并通过form的target指向这个iframe来提交数据,并且发送的header里将content-type设为了multipart/form,在JSP中不能成功导出的原因就在这里。这样的提交方式其参数通过request.getParameter是取不到的,当然你可以使用上传组件来获取,但这样代码就变得复杂。下面来解决这个问题,既然这里的Ajax使用是一个模拟的form提交,那我们其实可以完全不用。我们直接用form提交不是更省事吗?解决办法如下:创建一个隐藏form,其target设置为_blank,然后在其内部创建一个隐藏域存放xml数据,然后通过POST方式提交这个form即可。
var exportExcel = function(gridId,title,fileName){
var grid = Ext.getCmp(gridId);
var vExportContent = grid.getExcelXml(title);
//alert(vExportContent);
if (Ext.isIE6 || Ext.isIE7 || Ext.isIE8 || Ext.isSafari || Ext.isSafari2 || Ext.isSafari3) {
var fd=Ext.get('frmDummy');
if (!fd) {
fd=Ext.DomHelper.append(Ext.getBody(),{tag:'form',method:'post',id:'frmDummy',action:exportExcelUrl, target:'_blank',name:'frmDummy',cls:'x-hidden',cn:[
{tag:'input',name:'fileName',id:'fileName',type:'hidden'},
{tag:'input',name:'exportContent',id:'exportContent',type:'hidden'}
]},true);
}
fd.child('#fileName').set({value:fileName});
fd.child('#exportContent').set({value:vExportContent});
fd.dom.submit();
} else {
document.location = 'data:application/vnd.ms-excel;base64,'+Base64.encode(vExportContent);
}}
其中参数gridId为GridPanel的id,title为excel的sheet标题,fileName导出的excel文件名称。
导出的jsp如下:
<%@ page language="java" pageEncoding="UTF-8"%>
<%
String content = request.getParameter("exportContent");
String fileName = request.getParameter("fileName");
content = new String(content.getBytes("ISO8859_1"));
response.setHeader("Content-Type","application/force-download");
response.setHeader("Content-Type","application/vnd.ms-excel");
response.setHeader("Content-Disposition","attachment;filename="+fileName+".xls");
out.print(content);
%>
网上流传的很多版本在ie7、ie8中导出中文是乱码,需要在jsp文件中加上 <%@ page language="java" pageEncoding="UTF-8"%>头,获取的内容需要进行转码:
content = new String(content.getBytes("ISO8859_1"));
这样在ie7、ie8、Firefox中都可以导出中文。
但上面的版本只支持Windows操作系统,不支持Aix和Unix操作系统。下面给一个支持Aix操作系统的版本,我们只需要修改一下jsp即可:
<%@ page language="java" pageEncoding="UTF-8"%>
<%@page import= "java.net.URLEncoder "%>
<%
request.setCharacterEncoding("GBK");
String content = request.getParameter("exportContent");
String fileName = request.getParameter("fileName");
String os = System.getProperty("os.name");
if(os.contains("Windows")){
content = new String(content.getBytes("ISO8859_1"));//WINDOWS 下需要进行转码,AIX下不需要转码
}else if(os.contains("AIX")){
fileName = java.net.URLEncoder.encode(fileName,"UTF-8");//WINDOWS 下不需要对文件名进行转码,AIX下需要转码
}
response.setHeader("Content-Type","application/force-download");
response.setHeader("Content-Type","application/vnd.ms-excel");
response.setHeader("Content-Disposition","attachment;filename=" + fileName + ".xls");
out.print(content);
%>
分享到:
相关推荐
总结来说,"Ext Grid 导出Excel"这个话题涵盖了从JavaScript数据结构到Excel文件格式转换的过程,涉及到的主要技术有Ext JS的Grid和Store组件,以及第三方库SheetJS。这个过程对于那些需要提供数据导出功能的Web应用...
支持Ext3 Ext4导出excel,客户端导出表格,支持各种主流浏览器。
在实际业务场景中,有时我们需要将EXT Grid中的数据导出为Excel文件,以便于分析、存储或共享。这个过程涉及到EXT Grid与Excel文件格式之间的转换。 首先,EXT Grid提供了一个内置的导出功能,但默认情况下,它并不...
"Ext grid 导出Excel"是一个常见需求,它涉及到了JavaScript库Ext JS中的数据网格组件(Ext Grid)与Microsoft Excel文件格式的交互。下面我们将深入探讨这个主题。 首先,Ext JS是一个强大的JavaScript UI框架,它...
这篇博客“Ext Grid导出Excel”探讨的主题是如何将Ext Grid中的数据显示在Microsoft Excel文件中,这在数据分析、报告生成以及数据共享场景中非常常见。通过这个功能,用户可以方便地将网格数据导出为标准的Excel...
在EXT Grid中,用户常常需要将数据显示的数据导出到Excel文件中,以便于进一步的数据分析、存储或分享。本文将详细讲解EXT Grid如何实现Excel导出功能。 EXT Grid导出Excel功能的核心是利用浏览器的Blob对象和...
"extgrid导出excel"这个主题是关于如何将ExtJS中的数据网格(Ext Grid)的数据导出到Excel文件中,方便用户进行数据管理和分析。 首先,让我们深入了解一下Ext Grid。Ext Grid是一种用于展示和操作大量结构化数据的...
在本例中,我们将深入探讨如何使用JSP来实现EXT Grid的数据导出到Excel的功能。 EXT Grid是EXT JS框架中的一个核心组件,它提供了分页、排序、过滤、拖放等多种特性,用于展示结构化的数据。在实际应用中,我们经常...
在EXT Grid中,导出数据到Excel是一种常见的需求,它允许用户方便地处理和分析大量数据。EXT Grid是一个强大的JavaScript组件,提供了丰富的功能,包括数据展示、排序、筛选和编辑等。导出到Excel功能则进一步增强了...
在提供的压缩包文件"ext导出excel"中,可能包含了一个示例代码或者实现这个功能的完整解决方案。通过研究和学习这个代码,你可以更直观地了解上述步骤是如何在实践中进行的。此外,你还可以参考Sencha官方文档和社区...
这个“EXTgrid导出excel”的例子正是为了解决这个问题。 首先,我们需要理解EXTgrid的基本结构。EXTgrid由一系列列定义、行数据和配置选项组成。列定义包括列头文本、数据字段、宽度等属性,而行数据则是实际存储在...
在EXTJS这个强大的JavaScript框架中,实现导出Excel功能是一项常见的需求。EXTJS提供了一种高效的方法来将数据导出到Excel格式,使得用户能够方便地处理和分析数据。在这个场景下,我们可以从以下几个关键知识点入手...
标题"ext 4.2 grid导出excel 文件"指的是使用Ext JS 4.2版本的grid组件功能,将其中的数据转换成Excel格式,这样用户就可以方便地下载和处理。这个过程通常涉及到JavaScript、服务器端支持以及可能的文件处理库。 ...
ExtJs 4.2版本提供了内置的`Ext.grid.feature.Exporter`插件,它允许你直接从Grid导出数据到CSV或Excel格式。以下是使用此方法的步骤: 1. 在Grid配置中,添加`Exporter`插件。你需要指定导出的类型(如'csv'或'...
本文将深入讲解EXTJS Grid如何实现数据导出到Excel文件的功能。 首先,我们要明白EXTJS Grid的数据导出到Excel的过程通常涉及到以下几个步骤: 1. **获取Grid数据**:在EXTJS中,Grid的数据存储在Store对象中。要...
此Demo不包含jar包,请自行添加 博文链接:https://yourgame.iteye.com/blog/228826
在EXTJS Grid中导出数据到Excel是一种常见的需求,它允许用户方便地处理和分析大量数据。EXTJS是一个强大的JavaScript库,专门用于构建富客户端Web应用程序,而Grid组件是其核心部分,用于展示和管理表格数据。在...
### Ext Grid 数据导出到Excel知识点详解 #### 一、背景与目的 在现代Web应用开发中,数据展示和管理是十分重要的环节。对于大型的数据表格(Grid),开发者经常需要提供一个导出功能,以便用户可以将当前显示的...
本篇将详细讲解两种常见的导出Excel的方法:普通方式和Ext方式。 首先,让我们从普通方式导出Excel开始。普通方式通常指的是使用服务器端编程语言(如Java、Python、C#等)生成Excel文件,然后将其作为HTTP响应返回...
在本篇文章中,我们将深入探讨如何在ExtJS4中实现前台Grid的数据导出到Excel功能。 首先,我们需要了解`Ext.grid.Panel`,这是ExtJS中的核心组件之一,用于创建数据网格。它能够动态加载数据,提供排序、过滤、分页...