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 相关文章推荐
js 返回时间戳所对应的具体时间
Jul 20 Javascript
使用apply方法处理数组的三个技巧[译]
Sep 20 Javascript
php图像生成函数之间的区别分析
Dec 06 Javascript
怎么清空javascript数组
May 11 Javascript
jquery.messager.js插件导致页面抖动的解决方法
Jul 14 Javascript
JavaScript中的原始值和复杂值
Jan 07 Javascript
js判断手机浏览器操作系统和微信浏览器的方法
Apr 30 Javascript
BooStrap对导航条的改造实践小结
Sep 21 Javascript
JS轮播图中缓动函数的封装
Nov 25 Javascript
JS中的Replace()传入函数时的用法详解
Sep 11 Javascript
vue中Npm run build 根据环境传递参数方法来打包不同域名
Mar 29 Javascript
Vue使用预渲染代替SSR的方法
Jul 02 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
php仿QQ验证码的实例分析
2013/07/01 PHP
php更新mysql后获取改变行数的方法
2014/12/25 PHP
PHP利用APC模块实现文件上传进度条的方法
2015/01/26 PHP
PHP中对数组的一些常用的增、删、插操作函数总结
2015/11/27 PHP
PHPStorm+XDebug进行调试图文教程
2016/06/13 PHP
修改Laravel5.3中的路由文件与路径
2016/08/10 PHP
php微信开发之音乐回复功能
2018/06/14 PHP
50款非常棒的 jQuery 插件分享
2012/03/29 Javascript
jQuery-onload让第一次页面加载时图片是淡入方式显示
2012/05/23 Javascript
到处都是jQuery选择器的年代 不了解它们的性能,行吗
2012/06/18 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
JavaScript代码实现图片循环滚动效果
2020/03/19 Javascript
深入理解JS DOM事件机制
2016/08/06 Javascript
微信小程序 图片绝对定位(背景图片)
2017/04/05 Javascript
vue与bootstrap实现时间选择器的示例代码
2017/08/26 Javascript
jQuery实现常见的隐藏与展示列表效果示例
2018/06/04 jQuery
vue中的自定义分页插件组件的示例
2018/08/18 Javascript
js实现漂亮的星空背景
2019/11/01 Javascript
JS检索下拉列表框中被选项目的索引号(selectedIndex)
2019/12/17 Javascript
vue实现防抖的实例代码
2021/01/11 Vue.js
[43:35]TI4 循环赛第二日Liquid vs Fnatic
2014/07/11 DOTA
[01:02:06]LGD vs Mineski Supermajor 胜者组 BO3 第二场 6.5
2018/06/06 DOTA
解决谷歌搜索技术文章时打不开网页问题的python脚本
2013/02/10 Python
python3模拟百度登录并实现百度贴吧签到示例分享(百度贴吧自动签到)
2014/02/24 Python
在Python的Django框架中调用方法和处理无效变量
2015/07/15 Python
Python的GUI框架PySide的安装配置教程
2016/02/16 Python
Python实现判断一个字符串是否包含子串的方法总结
2017/11/21 Python
python 阶乘累加和的实例
2019/02/01 Python
python画图——实现在图上标注上具体数值的方法
2019/07/08 Python
浅析Python3 pip换源问题
2020/01/06 Python
简述synchronized和java.util.concurrent.locks.Lock的异同
2014/12/08 面试题
机关搬迁方案
2014/05/18 职场文书
学雷锋标语
2014/06/25 职场文书
2014公司年终工作总结
2014/12/19 职场文书
给老婆的保证书怎么写
2015/05/08 职场文书
八年级作文之友谊
2019/12/02 职场文书