ExtJS实现Excel导出

 

ExtJS实现Excel导出

标签: extjsexcelajax框架headerexceptionjavascript
  21504人阅读  评论(19)  收藏  举报
  分类:
 

ExtJS是一种基于客户端开发的AJAX应用,是一个与后台技术无关的前台ajax框架。由于项目需求,我们需要实现Excel的导出功能,前台界面是用ExtJS实现。如何实现呢?


1. 使用POI组件实现excel导出功能

[java]  view plain  copy
  1. //获取问题列表  
  2. List<Suggestion> targetStockList = suggestionService.getSuggestionList(map);  
  3.    
  4.         //创建一个新的Excel  
  5.         HSSFWorkbook workBook = new HSSFWorkbook();  
  6.         //创建sheet页  
  7.         HSSFSheet sheet = workBook.createSheet();  
  8.         //sheet页名称  
  9.         workBook.setSheetName(0"targetStockList");  
  10.         //创建header页  
  11.         HSSFHeader header = sheet.getHeader();  
  12.         //设置标题居中  
  13.         header.setCenter("标题");  
  14.           
  15.         //设置第一行为Header  
  16.         HSSFRow row = sheet.createRow(0);  
  17.         HSSFCell cell0 = row.createCell(Short.valueOf("0"));  
  18.         HSSFCell cell1 = row.createCell(Short.valueOf("1"));  
  19.         HSSFCell cell2 = row.createCell(Short.valueOf("2"));  
  20.    
  21.           
  22.         // 设置字符集  
  23.         cell0.setEncoding(HSSFCell.ENCODING_UTF_16);  
  24.         cell1.setEncoding(HSSFCell.ENCODING_UTF_16);  
  25.         cell2.setEncoding(HSSFCell.ENCODING_UTF_16);  
  26.   
  27.           
  28.         cell0.setCellValue("问题标题");  
  29.         cell1.setCellValue("问题描述");  
  30.         cell2.setCellValue("反馈时间");  
  31.       
  32.           
  33.         if(targetStockList != null && !targetStockList.isEmpty()) {  
  34.             for(int i = 0; i < targetStockList.size(); i++) {  
  35.                 Suggestion targetStock = targetStockList.get(i);  
  36.                 row = sheet.createRow(i + 1);  
  37.                 cell0 = row.createCell(Short.valueOf("0"));  
  38.                 cell1 = row.createCell(Short.valueOf("1"));  
  39.                 cell2 = row.createCell(Short.valueOf("2"));  
  40.   
  41.                   
  42.                 // 设置字符集  
  43.                 cell0.setEncoding(HSSFCell.ENCODING_UTF_16);  
  44.                 cell1.setEncoding(HSSFCell.ENCODING_UTF_16);  
  45.                 cell2.setEncoding(HSSFCell.ENCODING_UTF_16);  
  46.   
  47.                   
  48.                 cell0.setCellValue(targetStock.getType());  
  49.                 cell1.setCellValue(targetStock.getContent());  
  50.                 cell2.setCellValue(targetStock.getPublishTime());  
  51.        
  52.    
  53.                   
  54.                 sheet.setColumnWidth((short0, (short4000);  
  55.                 sheet.setColumnWidth((short1, (short4000);  
  56.                 sheet.setColumnWidth((short2, (short4000);  
  57.             }  
  58.         }  
  59.           
  60.         //通过Response把数据以Excel格式保存  
  61.         response.reset();  
  62.         response.setContentType("application/msexcel;charset=UTF-8");  
  63.         try {  
  64.             response.addHeader("Content-Disposition""attachment;filename=\""  
  65.                     + new String(("用户意见信息表" + ".xls").getBytes("GBK"),  
  66.                             "ISO8859_1") + "\"");  
  67.             OutputStream out = response.getOutputStream();  
  68.             workBook.write(out);  
  69.             out.flush();  
  70.             out.close();  
  71.         } catch (Exception e) {  
  72.             e.printStackTrace();  
  73.         }  
  74.         return null;  

2.ExtJS调用此函数,实现Excel的导出

我们知道在界面上通过一个按钮实现Excel的导出,ExtJS的按钮一般都是通过Ext.Ajax.request的异步请求实现数据提交的。但是在这里我们不能使用异步调用,我们需要在直接提示给用户是否保存或打开此文档。如何实现呢?

       其实很简单,我们如果了解了ExtJS就是Javascript开发的,我们就能够很容易实现此功能了。我们在按钮的触发事件中写入此段代码就能实现Excel的函数调用了。

[javascript]  view plain  copy
  1. // 初始化 Excel导出 的按钮  
  2. var exportExcel = Ext.get('exportExcel');  
  3. exportExcel.on('click', exportButtonClick);  
  4.   
  5. function exportButtonClick (){  
  6.      window.location.href = Ext.CONTEXT + '/admin/suggestion.do?method=exportTargetList';  
  7. ;  




6
4

我的同类文章

猜你在找
Extjs在Asp.Net中的应用开发
Excel数据透视表实战视频课程【你学得会】
AJAX零基础实战
[实录]SQL在Excel里的应用
PHP面向对象设计模式
id="iframeu1607657_0" src="http://pos.baidu.com/bcxm?sz=728x90&rdid=1607657&dc=2&di=u1607657&dri=0&dis=0&dai=2&ps=3650x221&coa=at%3D3%26rsi0%3D728%26rsi1%3D90%26pat%3D6%26tn%3DbaiduCustNativeAD%26rss1%3D%2523FFFFFF%26conBW%3D1%26adp%3D1%26ptt%3D0%26titFF%3D%2525E5%2525BE%2525AE%2525E8%2525BD%2525AF%2525E9%25259B%252585%2525E9%2525BB%252591%26titFS%3D%26rss2%3D%2523000000%26titSU%3D0%26ptbg%3D90%26piw%3D0%26pih%3D0%26ptp%3D0&dcb=BAIDU_SSP_define&dtm=BAIDU_DUP_SETJSONADSLOT&dvi=0.0&dci=-1&dpt=none&tsr=0&tpr=1460079524139&ti=ExtJS%E5%AE%9E%E7%8E%B0Excel%E5%AF%BC%E5%87%BA%20-%20gavinloo%E7%9A%84%E4%B8%93%E6%A0%8F%20-%20%E5%8D%9A%E5%AE%A2%E9%A2%91%E9%81%93%20-%20CSDN.NET&ari=1&dbv=2&drs=3&pcs=961x497&pss=980x6072&cfv=0&cpl=4&chi=1&cce=true&cec=UTF-8&tlm=1460079524&ltu=http%3A%2F%2Fblog.csdn.net%2Fgavinloo%2Farticle%2Fdetails%2F6707828&ltr=https%3A%2F%2Fwww.baidu.com%2Flink%3Furl%3DibrIJotHNSqGT0h5DExbj-dUIvf-epFtdszdlofq9Fd1GnAeAY-545I7u1DI956XH1-0iKzWQ3gYdG4w3w0QxK%26wd%3D%26eqid%3Ddcf032ec000090c30000000557070b6e&ecd=1&psr=1366x768&par=1366x728&pis=-1x-1&ccd=24&cja=false&cmi=6&col=zh-CN&cdo=-1&tcn=1460079524&qn=a15cb57f8937f0e8&tt=1460079524114.30.525.564" width="728" height="90" align="center,center" vspace="0" hspace="0" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" allowtransparency="true" style="border-width: 0px; border-style: initial; vertical-align: bottom; margin: 0px;">
查看评论
15楼  越写越溜的溜 6天前 17:56发表 [回复]
我想说那个map是个什么鬼?别的都可以理解,但真心不会map怎么赋值,我要把service里的方法怎么修改
Re:  qq_34006005 前天 16:55发表 [回复]
回复qq_33626703:同问!但是此贴貌似已沉!
14楼  煤石油 2014-06-05 16:14发表 [回复]
为什么我这边导出时,查询的参数传递不过去
text : '导出',
id: 'btn_xsl',
iconCls : 'tbar_buildingIcon',
handler : function() {
var appWindow = window.open('cardApplyExport!exportCardApply');
13楼  cobert 2014-04-28 11:12发表 [回复]
你好,你这个不用ajax,提交之后,页面不会跳转么?
12楼  wendylw2013 2014-03-31 20:38发表 [回复]
后面的ExtJS的传给一个exportTargetList函数那这个函数是默认的函数还是自己编写的java函数呢?
11楼  wendylw2013 2014-03-31 20:23发表 [回复]
请问poi需要哪些包呢?
10楼  wendylw2013 2014-03-31 19:38发表 [回复]
请问ExtJS的导入应该要怎么写
9楼  rick_lkl 2013-11-28 10:01发表 [回复]
Extjs的表单参数怎么加?
8楼  SunnyYoona 2013-10-28 17:09发表 [回复]
第一行中的map是啥?
7楼  yes_catherine 2013-10-17 14:05发表 [回复]
导出成功,非常感谢!!!
6楼  tsingvon 2012-12-03 12:49发表 [回复]
谢谢了找了好多天终于找到了 ff等环境没问题 除了IE 下载不下来 ,不知道怎么了
5楼  小姐你喜不喜欢吃青椒 2012-11-18 18:25发表 [回复]
你好,在谷歌浏览器中保存时显示的是自己设定的默认名称,后缀也是xls,但是ie下显示的保存名称是请求的url,而且没有后缀名,是什么原因,我用的ie10
4楼  猪猪超 2012-04-20 11:19发表 [回复]
有没有一个小例子~没学过POI 看这个好像都不懂
Re:  gavinloo 2012-04-24 10:50发表 [回复]
回复a30499671:网上相关的资料很多的,我也是在网上看的POI 的例子再自己做的。由于时间有点久了,你就自己查一下吧。POI的用法还是很简单的。
3楼  wolfphantasms 2012-04-18 17:12发表 [回复]
麻烦问一下,我的不能弹出下载框,而是在页面里显示json数据字符串
Re:  gavinloo 2012-04-19 17:37发表 [回复]
回复wolfphantasms:Json了解的不多,你是想把数据通过Json传给前台页面吧。我们项目直接把List<object>转换成String,然后传给前台的。
Json用在传单条记录,记录里包含了多个字段包括大字段。说的不好,请见谅。
2楼  fengshxr 2011-09-28 12:43发表 [回复]
v
1楼  pocket163 2011-09-14 11:25发表 [回复]
真气愤...代码拿出来就完整的拿出来..别乱取粘贴别人的
Re:  gavinloo 2011-09-14 14:30发表 [回复]
回复dq564267525:本人文笔有限,但是代码是我项目中的代码,Excel的Java导出和ExtJS如何调用都粘贴出来了。看不懂可以向我请教,别再别人博客上乱说话,你这么说只能说明你水平有限。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
以下是一个使用ExtJS 4.2.1的完整例子,可以将Grid表格导出Excel文件: ``` Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.util.*', 'Ext.toolbar.Paging', 'Ext.ux.exporter.Exporter' ]); Ext.onReady(function() { // 模拟数据 var data = []; for (var i = 0; i < 20; i++) { data.push({ name: 'User ' + i, email: 'user' + i + '@example.com', phone: '555-' + Ext.Number.randomInt(1000, 9999) }); } // 创建数据模型 Ext.define('User', { extend: 'Ext.data.Model', fields: ['name', 'email', 'phone'] }); // 创建数据源 var store = Ext.create('Ext.data.Store', { model: 'User', data: data, proxy: { type: 'memory', reader: { type: 'json', root: 'data' } } }); // 创建Grid表格 var grid = Ext.create('Ext.grid.Panel', { store: store, columns: [{ text: 'Name', dataIndex: 'name' }, { text: 'Email', dataIndex: 'email', flex: 1 }, { text: 'Phone', dataIndex: 'phone' }], width: 400, height: 200, dockedItems: [{ xtype: 'toolbar', dock: 'top', items: [{ xtype: 'button', text: 'Export to Excel', handler: function() { // 导出Excel Ext.ux.exporter.Exporter.exportGrid(grid, 'Excel', { title: 'User List' }); } }] }, { xtype: 'pagingtoolbar', store: store, dock: 'bottom', displayInfo: true }] }); // 渲染Grid表格 Ext.create('Ext.container.Viewport', { layout: 'fit', items: [grid] }); }); ``` 在上面的代码中,我们首先定义了一个模拟数据数组,然后创建了一个数据模型和一个数据源。接下来,我们创建了一个Grid表格,将数据源绑定到该表格中,并添加了一个工具栏和一个分页工具栏。在工具栏中,我们添加了一个按钮,当用户单击该按钮时,将调用Ext.ux.exporter.Exporter.exportGrid函数将Grid表格导出Excel文件。 需要注意的是,我们使用了Ext.ux.exporter.Exporter类来执行导出操作。该类是ExtJS的一个扩展,需要在应用程序中明确声明。在本例中,我们使用了Ext.require函数来加载必需的类和扩展。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值