ExtJS4.x Grid导出到Excel(详解)

阅读更多

看了网上很多例子，操作均不够具体，且大都用的是同一个源文件（http://blog.csdn.net/lc448986375/article/details/8205362），想来定是受了原博主的毒害^_^

1.下载并解压文件夹 

下载地址：http://down.51cto.com/data/985208

2.htm显示页面导入export-all.js文件,如：

< script  src = "XXX/export-all.js"  type = "text/javascript" > script >;
并且最好放在导入extjs文件之后。

3.

1 2	Ext.Loader.setConfig({ enabled: true }); Ext.Loader.setPath( 'Ext.ux.exporter' , 'XXX/exporter' ); //这里是你的路径，一定要配置正确才可以正常使用

Ext.require([
    'Ext.ux.exporter.Exporter'
  ]);
4.到这里才是在你的Grid上添加以下代码

dockedItems: [
                {
                    xtype:  'toolbar' ,
                    dock:  'top' ,
                    items: [
                        Ext.create( 'Ext.ux.exporter.Button' , {
                            component: Ext.getCmp( 'grid' ),
                            text:  "导出 Excel"
                        })
                    ]
                }
            ]

至于后面提到的几点注意问题（原文如下： 

1、dockItems必须在grid上，否则将提示没有is方法

2、如果grid中有checkbox将会导致导出的excel文件中内容和表头错位

3、导出的excel文件不能用poi读取，我是在网上看到的代码，我查了些资料，因为头文件信息的问题，所以如果用poi读取会报错，如果有高人可以修改下。当然，如果只是导出，不需要poi导入的话这个足够用了

）我都没有遇到，我相信大家都按照正确的步骤一步步过来是不会有什么大的问题出现的。

    另有以下一项在grid上配置的时候很不稳定，动辄导致导出功能失效，若有必要可注释掉它。