`
qimo601
  • 浏览: 3439389 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

Extjs 从grid中导出Excel表格。后台为C#(绝对好用)(按照自己的需求修改版本)

阅读更多

最近生成Excel表格,稍微得到一点新的体会,特此更新自己开发时候的版本。

开发工具:VS2005

数据库:oracle10.1

浏览器:firefox3.5.9

 

第一步,web层aspx文件 需要载入附件中的ExportGridToExcel.js(注释的地方可以改变表Excel表格最后的展示样式)。

载入方法:在<head></head>之间写入代码:

 <!--导出excel表格脚本-->		
    <script type="text/javascript" src="../../../Js/Common/ExportGridToExcel.js"></script>

 

第二步,基本参数初始化,准备调用导出Excel表格函数ExportExcel(componentsGridPanel, config,"GetComponentsBillList");(这个方法大家可以自己定义参数)

 //==导出Excel配置==//
    var config = {
        store: null,//因为后续可能需要处理分页,因此此处一般不直接传递GridPanel的数据源
     title: '',//标题
     checkId: '',
        storageName: '',
        beginTime: '',
        endTime: '',
        checker: ''
    };
    
    //盘点单基本信息设置
    config.title = title;
    config.checkId = checkId;
    config.storageName = storageName;
    config.beginTime = beginTime;
    config.endTime = endTime;
    config.checker = checker;
    
    //导出Excel表格,生成盘点计划中的部件盘点单  公共函数 CheckWarehouseView.js文件中
    //属性解释:gridPanel名,基本配置信息,store后台方法
    ExportExcel(componentsGridPanel, config,"GetComponentsBillList");

 第三步,函数ExportExcel(gridPanel, config,operate)//原先有部分浏览器的判断,导致导出的文件中文名无法传递。去掉后,到目前没出现安全问题。

//==导出Execl表格==//
//gridPanel:当前grid,config:生成单配置,operate:后台url调用的方法
function ExportExcel(gridPanel, config,operate){
    if (gridPanel) {
        var tmpStore = gridPanel.getStore();
        var tmpExportContent = '';        
        var tmpAllStore = new Ext.data.GroupingStore({//重新定义一个数据源
            proxy: tmpStore.proxy,
            reader: tmpStore.reader
        });
        
        tmpAllStore.load({//获取所有数据
            params: {
                secondLevelStorageId: secondLevelStorageId,
                thirdLevelStorageId: thirdLevelStorageId,
                operate: operate
            }
        });
        tmpAllStore.on('load', function(store){
            config.store = store;
            tmpExportContent = gridPanel.getExcelXml(false, config);//此方法用到了一中的扩展
                if (!Ext.fly('frmDummy')) {
                    var frm = document.createElement('form');
                    frm.id = 'frmDummy';
                    frm.name = id;
                    frm.className = 'x-hidden';
                    document.body.appendChild(frm);
                }
                
                Ext.Ajax.request({
                    url: '../../../Url/Common/ExportServicePage.aspx',//将生成的xml发送到服务器端
                    method: 'POST',
                    form: Ext.fly('frmDummy'),
                    callback: function(o, s, r){
                        //alert(r.responseText);                    
                    },
                    isUpload: true,
                    params: {
                        ExportContent: tmpExportContent,
                        ExportFile: config.storageName+"-"+config.title+ '.xls'
                    }
                });
        });
    }
};

 

第四步,后台页面ExportServicePage.aspx代码(去掉编码处理,这样可以避免传到客户端的文件为乱码)

 

 

//===============================================================================
// Copyright (C) 2010 XXXX有限公司。版权所有。 
//===============================================================================
// 
// 文件名:ExportServicePage.aspx.cs
//
// 文件描述:导出Excel表格
//
//
// 创建人:truman
// 创建时间:2010年3月24日
//
// 修改人:
// 修改时间:
// 修改描述:
//===============================================================================

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

namespace AfcMaintenanceSystem.Url.Common
{
    public partial class ExportServicePage : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                if (Request["ExportContent"] != "")
                {

                    string tmpFileName = "export.xls";
                    string tmpContent = Request["ExportContent"];//获取传递上来的文件内容
                    if (Request["ExportFile"] != "")
                    {
                        tmpFileName = Request["ExportFile"];//获取传递上来的文件名
                        //tmpFileName = System.Web.HttpUtility.UrlEncode(Request.ContentEncoding.GetBytes(tmpFileName));//处理中文文件名的情况 
                    }

                    Response.Write("&amp;lt;script&amp;gt;document.close();&amp;lt;/script&amp;gt;");
                    Response.Clear();
                    Response.Buffer = true;
                    Response.ContentType = "application/vnd.ms-excel";
                    Response.AddHeader("Content-Disposition", "attachment;filename=\"" + tmpFileName + "\"");
                    Response.Charset = "";

                    this.EnableViewState = false;
                    System.IO.StringWriter tmpSW = new System.IO.StringWriter();
                    System.Web.UI.HtmlTextWriter tmpHTW = new System.Web.UI.HtmlTextWriter(tmpSW);
                    tmpHTW.WriteLine(tmpContent);
                    Response.Write(tmpSW.ToString());
                    Response.End();

                }
            }
        }
    }
}

 

 在界面成gridPanel中设计好布局的格式,经过如上几步代码,即可下载到自己想要格式的Excel文件。

web界面展示:

 

Excel表格展示:

 

 

4
2
分享到:
评论
4 楼 qimo601 2012-04-28  
qingzhishuishou 写道
params: {  
14.                secondLevelStorageId: secondLevelStorageId,  
15.                thirdLevelStorageId: thirdLevelStorageId,  
16.                operate: operate  
17.            } 
里面的参数代表什么啊?老是报内存不够


这几个参应该只是两个Id值,和一个操作方法字符串

应该不是它占得内存
3 楼 qingzhishuishou 2012-04-20  
params: {  
14.                secondLevelStorageId: secondLevelStorageId,  
15.                thirdLevelStorageId: thirdLevelStorageId,  
16.                operate: operate  
17.            } 
里面的参数代表什么啊?老是报内存不够
2 楼 qimo601 2012-04-18  
xiefeng 写道
很好,
可是数据量大,就出问题
100条数据就出问题,怎么回事呢



额不好意思。。。已经两年多没用过Extjs了,完全忘记了。
当时我用的时候,是没有问题的。

欢迎您提供您的解决方法!
1 楼 xiefeng 2011-10-18  
很好,
可是数据量大,就出问题
100条数据就出问题,怎么回事呢

相关推荐

    Extjs4 grid 导出为Excel

    Extjs4 grid 导出为Excel 下载后放在网站(不放在网站中导出按钮不能会点击无响应,因为这里调用了swf文件)里可直接运行index.html测试 &lt;link href='...

    extjs grid数据导出excel文件

    本文将深入讲解EXTJS Grid如何实现数据导出到Excel文件的功能。 首先,我们要明白EXTJS Grid的数据导出到Excel的过程通常涉及到以下几个步骤: 1. **获取Grid数据**:在EXTJS中,Grid的数据存储在Store对象中。要...

    EXTJS grid导出EXCEL文件

    2. **数据导出**:在EXTJS中,数据导出功能通常涉及到将Grid中的数据显示在其他格式,如CSV、PDF或Excel中。这通常是通过编写自定义插件或者扩展Grid的功能来实现的。 3. **EXTJS 3.2.0**:这是EXTJS的一个特定版本...

    ExtJs grid导出Excel

    当需要将Grid中的数据导出到Excel时,可以采用两种方法,这些方法在ExtJs 4.2版本中已经得到很好的支持。 **方法一:使用XLSX.js库** XLSX.js是一个JavaScript库,能够方便地读取和写入Excel文件。在ExtJs中,你...

    EXTJS Grid导出Excel

    在EXTJS Grid中导出数据到Excel是一种常见的需求,它允许用户方便地处理和分析大量数据。EXTJS是一个强大的JavaScript库,专门用于构建富客户端Web应用程序,而Grid组件是其核心部分,用于展示和管理表格数据。在...

    Extjs4前台前台grid导出excel

    在ExtJS4中,我们可能有以下场景:用户在Grid中查看数据,然后希望将这些数据导出到Excel以便进一步分析或处理。 要实现这个功能,我们可以利用JavaScript库如`SheetJS`(又名`js-xlsx`),这是一个强大的开源库,...

    ExtJS4.0 分享Grid导出Excel插件(3.28更新支持4.1)

    在标题中提到的"ExtJS4.0 分享Grid导出Excel插件"是一个扩展功能,允许用户将ExtJS Grid中的数据导出为Microsoft Excel格式的文件。这对于数据分析、报表生成以及数据共享非常有用。 这个插件是针对ExtJS 4.0版本...

    Ext Grid 导出Excel

    当我们需要将Ext Grid中的数据导出为Excel格式时,这通常涉及到数据的处理和转换,以便用户能够方便地在离线环境中分析或共享。这篇博客"Ext Grid 导出Excel"可能详细介绍了如何实现这一功能。 首先,让我们理解Ext...

    extjs4导出excel

    "extjs4导出excel"的功能就是实现了这个需求,让用户能够在ExtJS 4应用中方便地导出表格数据到Excel文件。 在ExtJS 4中实现数据导出至Excel通常涉及以下几个关键步骤: 1. **数据收集**:首先,你需要收集要导出的...

    Extjs4.2前台导出Excel(多次导出失败bug已修改)

    在IT行业中,前端开发经常会遇到需要将数据导出到Excel的需求,这有助于用户进行数据分析、存储或分享。本文主要探讨的是使用Extjs4.2框架实现纯前台导出Excel功能,并针对多次导出失败的问题进行了修复。 Extjs是...

    EXTJS4导出excel示例

    在EXTJS4中,实现导出数据到Excel的功能是一项常见的需求,这可以帮助用户方便地处理和存储大量数据。本示例将详细介绍EXTJS4如何实现Excel导出,并提供相关的代码示例。 EXTJS4的核心是其组件模型,包括表格(Grid...

    前台用extjs后台用java.如何导出excel报表

    在IT行业中,前端和后端的协作是实现各种功能的关键,比如在本例中,我们需要在前端使用ExtJS,后端使用Java来实现一个导出Excel报表的功能。这个功能允许用户点击按钮后,系统生成一个Excel文件,包含了指定的数据...

    ExtJs6.5Grid列表导出(包含样式)

    在ExtJs 6.5版本中,开发人员经常需要实现数据导出功能,特别是对于Grid组件,这是一项常见的需求。Grid列表通常用于展示大量结构化的数据,而导出功能可以帮助用户将这些数据保存到本地,方便进一步分析或共享。...

    ExtJs6 导出excel(包含分组、分组合计行、二重表头)

    描述中提到的“改了改官方提供的js”,意味着开发者可能基于ExtJS的源代码或社区提供的示例,修改了导出功能以适应自己的需求,特别是针对二重表头进行了定制。 导出Excel的过程通常包括以下几个步骤: 1. 首先,...

    ExtJS导出Excel

    "ExtJS导出Excel"的功能则是允许用户将`grid`中的数据方便地导出为Excel格式,这样可以方便数据的保存、分析和共享。 在实现页面级的ExtJS `grid`数据导出到Excel时,通常会涉及到以下几个关键知识点: 1. **ExtJS...

    extjs模拟excel表格

    在本文中,我们将深入探讨如何使用ExtJS来模拟Excel表格,以及实现Excel的各种功能。 首先,ExtJS中的GridPanel组件是实现模拟Excel表格的核心。GridPanel允许我们展示大量数据,并提供了诸如排序、过滤、分页等...

    ExtJS实现Excel导出

    ExtJS结合Apache POI实现了高效且灵活的Excel导出功能,满足了项目中数据导出的需求。通过对数据的收集、格式化、Excel对象的创建与填充,再到最终的文件输出,整个流程清晰明了,便于理解和实施。在实际应用中,...

    extjs把数据导出至excel

    标题 "extjs把数据导出至excel" 涉及的是使用ExtJS 3这个JavaScript框架将数据导出到Excel文件的技术。ExtJS是一个用于构建Web应用的前端库,提供了丰富的组件和API,使得在浏览器端处理数据变得更加方便。在这个...

Global site tag (gtag.js) - Google Analytics