ExtJS4 动态生成的grid导出为excel示例


Posted in Javascript onMay 02, 2014

搜索了蛮久,找到一些例子,因为我是初学者的缘故大多不知道怎么使用。。

研究了一下那个源码,搞到现在终于实现了基本的下载。解决了一个表格不能重复下载的小BUG,一个使用grid初始化发生的BUG

下面记录一下步骤。说不定下次还有用

1.下载需要用到js代码,我已经上传 

2.在你的html文件中加入引用,路径问题自己 注意下,下面是我的路径

<script type="text/javascript" src="../export/export-all.js" ></script>;

3.在你要用到的JS代码的Ext.onReady()的开始加上
Ext.Loader.setConfig({ enabled: true }); 
Ext.Loader.setPath('Ext.ux.exporter', '../export/exporter'); 
Ext.require([ 
'Ext.ux.exporter.Exporter' 
]);

设置命名空间。。注意路径

4.在代码里面使用,在你需要下载功能的grid处合适的地方加入

xtype: 'exporterbutton', 
// store: store 
component: Ext.getCmp('gird_a')

这是两种初始化excel的方式,一种用store初始化,使用store的fields和data,因为我的store中的fields名字是英文,导出来的列名是英文所以我没有使用这种,而是直接用grid进行初始化。

下面说下在别人的代码基础上我修改的地方

1.在exporter.js第40行,改成了

var columns = Ext.Array.filter(grid.columnManager.columns,

原来的代码在第一个参数那里是grid.columns,后来我发现动态生成的grid在reconfigure之后columns放在columnManager.columns里,所以这么改

2.在workbook.js中77.78行,加了两句话

this.styles=[]; 
this.worksheets=[];

以上2行代码进行一些初始化,否则excel每次生成因为没有清空之前的数据导致格式错误

经过以上的简单修改已经可以对一个grid随意导出,并且支持对定制字段的表格导出,即导出表格显示的列

效果图在这里:
ExtJS4 动态生成的grid导出为excel示例 
ExtJS4 动态生成的grid导出为excel示例 

Javascript 相关文章推荐
javascript语句中的CDATA标签的意义
May 09 Javascript
使用jquery动态加载Js文件和Css文件
Oct 24 Javascript
使用JQuery实现的分页插件分享
Nov 05 Javascript
基于javascript实现根据身份证号码识别性别和年龄
Jan 22 Javascript
Angular.js 实现数字转换汉字实例代码
Jul 14 Javascript
JavaScript调试的多个必备小Tips
Jan 15 Javascript
Ionic 2 实现列表滑动删除按钮的方法
Jan 22 Javascript
JavaScript 数据类型详解
Mar 13 Javascript
jQuery获取table下某一行某一列的值实现代码
Apr 07 jQuery
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
AngularJS实现自定义指令及指令配置项的方法
Nov 20 Javascript
关于微信小程序登录的那些事
Jan 08 Javascript
jQuery1.9.1针对checkbox的调整方法(prop)
May 01 #Javascript
jquery等待效果示例
May 01 #Javascript
js实现checkbox全选和反选示例
May 01 #Javascript
jquery插件之定时查询待处理任务数量
May 01 #Javascript
自己使用jquery写的一个无缝滚动的插件
Apr 30 #Javascript
js 弹出新页面避免被浏览器、ad拦截的一种新方法
Apr 30 #Javascript
使用Jquery获取带特殊符号的ID 标签的方法
Apr 30 #Javascript
You might like
CodeIgniter 完美解决URL含有中文字符串
2016/05/13 PHP
Joomla框架实现字符串截取的方法示例
2017/07/18 PHP
laravel5.5添加echarts实现画图功能的方法
2019/10/09 PHP
使用javascript控制cookie显示和隐藏背景图
2014/02/12 Javascript
JS小游戏之仙剑翻牌源码详解
2014/09/25 Javascript
JavaScript访问字符串中单个字符的两种方法
2015/07/03 Javascript
jquery实现可横向和竖向展开的动态下滑菜单效果
2015/08/24 Javascript
实例代码详解jquery.slides.js
2015/11/16 Javascript
thinkphp实现无限分类(使用递归)
2015/12/19 Javascript
nodejs如何获取时间戳与时间差
2016/08/03 NodeJs
JS常用加密编码与算法实例总结
2016/12/22 Javascript
bootstrapValidator 重新启用提交按钮的方法
2017/02/20 Javascript
JavaScript实用代码小技巧
2018/08/23 Javascript
JS实现提示框跟随鼠标移动
2019/08/27 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
2020/01/20 Javascript
[00:59]DOTA2背景故事第二期之四大基本法则
2020/07/07 DOTA
python实现淘宝秒杀聚划算抢购自动提醒源码
2020/06/23 Python
Selenium+Python 自动化操控登录界面实例(有简单验证码图片校验)
2019/06/28 Python
Python获取好友地区分布及好友性别分布情况代码详解
2019/07/10 Python
Django对数据库进行添加与更新的例子
2019/07/12 Python
Python爬虫之urllib基础用法教程
2019/10/12 Python
使用python+poco+夜神模拟器进行自动化测试实例
2020/04/23 Python
python Scrapy爬虫框架的使用
2021/01/21 Python
使用html2canvas实现将html内容写入到canvas中生成图片
2020/01/03 HTML / CSS
Johnston & Murphy官网: 约翰斯顿·墨菲牛津总统鞋
2018/01/09 全球购物
肯尼迪就职演说稿
2013/12/31 职场文书
劳动之星获奖感言
2014/02/01 职场文书
岗位职责的构建方法
2014/02/01 职场文书
餐厅执行经理岗位职责范本
2014/02/26 职场文书
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
大学学生会竞选演讲稿
2014/04/25 职场文书
中韩经贸翻译专业大学生职业生涯规划范文
2014/09/18 职场文书
新郎新娘答谢词
2015/01/04 职场文书
小学班主任自我评价
2015/03/11 职场文书
使用Redis实现秒杀功能的简单方法
2021/05/08 Redis
MySQL命令无法输入中文问题的解决方式
2021/08/30 MySQL