如何实现 Ext grid导出Excel?写好的代码在我的资源里,可以进行下载

近期在做一个项目,项目的要求是:

利用Ext grid显示前台数据,然后把前台数据进行Excel表导出,再导出报表的时候要求:

1、要把grid数据显示的表头信息导入Excel表

2、在导出Excle表的时候,可以进行选择,是进行勾选的导出,还是批量导出(勾选导出,根据勾选的记录导出,批量导出,全部导出),

3、在进行批量导出的时候,是分页显示还是显示成一页(sheet标签,在Excel表中用)

首先,我们先准备数据,创建grid并把数据填充进去,这里我就不再多说,不是本文的重点:

但需要说明的是,在进行store准备数据的时候,我们要保证命名的规范性,为接下来的利用java反射取得数据打下基础,

 

 

接下来根据要求,我们设计一个按钮,当点击按钮的时候,弹出一个窗口,即上图中的图片,为我们提供选择

还有就是要得到grid数据的表头信息

关键代码:strBuffer为我们自己重写的StringBuffer类

 for(var j=2; j<columns.getColumnCount(); j++){    
              strBuffer1.append(columns.getColumnHeader(j));   /*得到所有列头信息并放入StringBuffer中*/
              strBuffer1.append(",");       /*添加分隔符*/
  }

那为什么我们要在每一个字段之后加上一个“,”号呢?这里我们把数据传递到后台做准备的,这样我们就只需要把一个字符串传递到后台中,然后再在后台中利用java的split方法把数据再提取出来

得到勾选的数据的编号,即数据在数据库的id号,我们也是利用字符串向后台进行传递:

for(var k=2; k<columns.getColumnCount(); k++){    
                                  strBuffer2.append(columns.getDataIndex(k));   /*得到所有列头信息并放入StringBuffer中*/
                                  strBuffer2.append(",");       /*添加分隔符*/
 }

 

 

已经把前台的各项数据都已经得到,那么就需要向后台来传递啦!!

这里我们是做出了一个Ext的一个简单的弹出窗口来实现的,如第一个图中,

这里我们是利用Ext.form的submit()方式进行的提交,在这里一定要注意是submit()方式,而不能是Ajax,这与我们后面的弹出导出Excel的窗口是紧密相连的,关键代码:

  var f = new Ext.FormPanel({
              frame:true,
              layout:"form",
              buttonAlign:'center',
              onSubmit: Ext.emptyFn,
              submit: function() {
                      this.getEl().dom.action= url;
                      this.getEl().dom.method = 'post',
                      this.getEl().dom.submit(),
                      win.close()
              },

           …………

 

   var btnSubmit = new Ext.Button({
               text: "提交",
               handler: function(){
                        f.getForm().submit();
               }
    });   

 

以这种方式提交,并不是真正的Ajax,而是类似于普通Html的表单提交方式,

看后台代码如何来解析从前台获得的数据:


        String empStr = request.getParameter("headers");   //拆分字符串得到表头信息
        if(!"".equals(empStr) && null!= empStr){
            String str1 = empStr.substring(0, empStr.length()-1);
            headers = str1.split(",");
        }

 

这样就把前台的数据传递到后台,然后就是进行流的输入输出,生成Excel:关键代码如下

WritableWorkbook wwb = Workbook.createWorkbook(os);

for (int j = 0; j < title.length; j++) {// 开始写入第一行(即标题栏)
            Label label = null;       // 用于写入文本内容到工作表中去
            label = new Label(j, 0, title[j]);  // 在Label对象的构造中指明单元格位置(参数依次代表列数、行数、内容 )
            sheet.setColumnView(j, 30);   // 将定义好的单元格添加到工作表中
            sheet.addCell(label);
        }
       
        for (int row = 0; row < empList.size(); row++) {  // 开始写入内容
            List list = (List) empList.get(row);   // 获取一条(一行)记录
            for (int col = 0; col < list.size(); col++) {  // 数据是文本时(用label写入到工作表中)
                String listvalue = (String) list.get(col).toString();
                Label label = null;
                label = new Label(col, row + 1, listvalue);
                sheet.addCell(label);
            }
        }

 

然后就是弹出窗口,提示用户进行“打开”或者是“保存”啦!!

        OutputStream out = null;
        InputStream in = null;
        // 获得文件名
        String filename = URLEncoder.encode(file.getName(), "UTF-8");
        // 定义输出类型(下载)
        response.setContentType("application/force-download");
        response.setHeader("Location", filename);

        // 定义输出文件头
        response.setHeader("Content-Disposition", "attachment;filename="
                + filename);
        out = response.getOutputStream();
        in = new FileInputStream(file.getPath());

        byte[] buffer = new byte[1024];
        int i = -1;
        while ((i = in.read(buffer)) != -1) {
            out.write(buffer, 0, i);
        }

        in.close();
        out.flush();
        out.close();
       
        if (isDel) {
            // 删除文件,删除前关闭所有的Stream.
            file.delete();
        }

 

然后就会弹出窗口:

 

至此,我们的工作基本完成!!!

部分关键代码已经在我的资源里,可以进行下载!!!

链接地址:http://download.csdn.net/detail/yixiaotian1988/3131811

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 8
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值