<%@ page language="java" pageEncoding="GBK"%>
<%@page contentType="text/html;charset=UTF-8"%>
<html>
<head>
<title>Column Layout</title>
<link rel="stylesheet" type="text/css" href="js/ext-all.css" />
<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<script type="text/javascript" src="js/gridToExcel.js"></script>
<!--<script type="text/javascript" src="js/ext-lang-zh_CN-GBK-min.js"></script>
--><script type="text/javascript">
Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var myData = [
['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
['Altria Group Inc',83.81,0.28,0.34,'9/1 12:00am'],
['American Express Company',52.55,0.01,0.02,'9/1 12:00am'],
['American International Group, Inc.',64.13,0.31,0.49,'9/1 12:00am'],
['AT&T Inc.',31.61,-0.48,-1.54,'9/1 12:00am'],
['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
['Caterpillar Inc.',67.27,0.92,1.39,'9/1 12:00am'],
['Citigroup, Inc.',49.37,0.02,0.04,'9/1 12:00am'],
['中国银行',49.37,0.02,0.04,'9/1 12:00am']
];
// example of custom renderer function
function change(val){
if(val > 0){
return '<span style="color:green;">' + val + '</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '</span>';
}
return val;
}
// example of custom renderer function
function pctChange(val){
if(val > 0){
return '<span style="color:green;">' + val + '%</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '%</span>';
}
return val;
}
// create the data store
var store = new Ext.data.SimpleStore({
fields: [
{name: 'company'},
{name: 'price', type: 'float'},
{name: 'change', type: 'float'},
{name: 'pctChange', type: 'float'},
{name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'}
]
});
store.loadData(myData);
var linkButton = new Ext.Button({
text: '导出到Excel',
handler: function() {
var vExportContent = grid.getExcelXml();
if (Ext.isIE6 || Ext.isIE7 || Ext.isSafari || Ext.isSafari2 || Ext.isSafari3) {
var fd=Ext.get('frmDummy');
alert(vExportContent);
alert(fd);
if (!fd) {
fd=Ext.DomHelper.append(Ext.getBody(),{tag:'form',method:'post',id:'frmDummy',action:'exportexcel.jsp', target:'_blank',name:'frmDummy',cls:'x-hidden',cn:[
{tag:'input',name:'exportContent',id:'exportContent',type:'hidden'}
]},true);
}
fd.child('#exportContent').set({value:vExportContent});
fd.dom.submit();
} else {
document.location = 'data:application/vnd.ms-excel;base64,'+Base64.encode(vExportContent);
}}
});
// create the Grid
var grid = new Ext.grid.GridPanel({
id: 'static-grid',
store: store,
columns: [
{id:'company',header: "Company", width: 160, sortable: true, dataIndex: 'company'},
{header: "Price", width: 75, sortable: true, renderer: 'usMoney', dataIndex: 'price'},
{header: "Change", width: 75, sortable: true, renderer: change, dataIndex: 'change'},
{header: "% Change", width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
{header: "Last Updated", width: 85, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
],
stripeRows: true,
autoExpandColumn: 'company',
height:350,
width:600,
title:'EXT Grid 导出',
bbar: new Ext.Toolbar({
buttons: [linkButton]
})
});
grid.render('grid-example');
grid.getSelectionModel().selectFirstRow();
});
</script>
</head>
<body>
<div id="grid-example"></div>
</body>
</html>
分享到：
相关推荐
要实现"ext导出excel"，首先需要在JSP页面上创建EXT AJAX请求。在EXT中，你可以使用`Ext.Ajax.request`方法发起异步请求。请求的目标是一个Servlet或者Controller，这个后端处理程序将负责生成Excel文件。在请求参数...
在这个"EXT导出Excel代码demo"中，我们将探讨如何使用EXT 3.3实现将数据导出到Excel文件的功能。 在EXT应用中，导出数据到Excel通常涉及到以下几个关键步骤： 1. 数据准备：首先，你需要收集并格式化要导出的数据...
`ext打印`、`jquery打印`和`ext导出excel`都是与前端开发密切相关的技术，主要用于提升用户体验和增强数据处理能力。 首先，我们来详细了解一下`ext打印`。EXT是一个流行的JavaScript框架，用于构建富客户端应用。...
在EXTJS这个强大的JavaScript框架中，实现导出Excel功能是一项常见的需求。EXTJS提供了一种高效的方法来将数据导出到Excel格式，使得用户能够方便地处理和分析数据。在这个场景下，我们可以从以下几个关键知识点入手...
标题中的“Ext导出Excel源码”指的是使用ExtJS库来实现从Web应用程序导出数据到Excel文件的功能。ExtJS是一个流行的JavaScript框架，用于构建富客户端应用，而Excel导出功能则是许多企业级应用中常见的需求，允许...
在提供的压缩包文件"ext导出excel"中，可能包含了一个示例代码或者实现这个功能的完整解决方案。通过研究和学习这个代码，你可以更直观地了解上述步骤是如何在实践中进行的。此外，你还可以参考Sencha官方文档和社区...
这篇博客"Ext Grid 导出Excel"可能详细介绍了如何实现这一功能。 首先，让我们理解Ext Grid的基本工作原理。Ext Grid是Sencha Ext JS框架的一部分，它允许开发者创建可配置的表格视图，可以显示从服务器获取的数据...
支持Ext3 Ext4导出excel,客户端导出表格，支持各种主流浏览器。
本主题主要关注两个关键功能：内存分页和导出Excel。 内存分页是处理大量数据时的一种策略，尤其是在Web应用中，由于HTTP请求的限制，一次性加载所有数据并不实际。内存分页允许用户只加载屏幕可见的数据，从而提高...
综上所述，EXT Grid导出Excel涉及到的技术主要包括EXT Grid的数据操作、XLSX.js库的使用、自定义按钮和事件处理、文件下载触发机制以及可能的样式转换和性能优化。通过这些技术，我们可以实现EXT Grid数据的便捷导出...
这篇博客“Ext Grid导出Excel”探讨的主题是如何将Ext Grid中的数据显示在Microsoft Excel文件中，这在数据分析、报告生成以及数据共享场景中非常常见。通过这个功能，用户可以方便地将网格数据导出为标准的Excel...
"Ext grid 导出Excel"是一个常见需求，它涉及到了JavaScript库Ext JS中的数据网格组件（Ext Grid）与Microsoft Excel文件格式的交互。下面我们将深入探讨这个主题。 首先，Ext JS是一个强大的JavaScript UI框架，它...
本篇将详细讲解两种常见的导出Excel的方法：普通方式和Ext方式。 首先，让我们从普通方式导出Excel开始。普通方式通常指的是使用服务器端编程语言（如Java、Python、C#等）生成Excel文件，然后将其作为HTTP响应返回...
在EXT Grid中，导出数据...以上就是EXT Grid导出Excel的基本流程和技术要点。在"engierManger"这个项目中，你可能需要结合具体的业务逻辑和代码实现这个功能。记住，始终要关注用户体验，确保导出过程快速且用户友好。
标题"ext 4.2 grid导出excel 文件"指的是使用Ext JS 4.2版本的grid组件功能，将其中的数据转换成Excel格式，这样用户就可以方便地下载和处理。这个过程通常涉及到JavaScript、服务器端支持以及可能的文件处理库。 ...
EXT Grid导出Excel功能的核心是利用浏览器的Blob对象和FileSaver.js库。Blob对象可以用来存储二进制数据，而FileSaver.js则提供了在用户本地保存文件的能力。首先，我们需要确保EXT Grid的数据已经加载完成并且正确...
"extgrid导出excel"这个主题是关于如何将ExtJS中的数据网格（Ext Grid）的数据导出到Excel文件中，方便用户进行数据管理和分析。 首先，让我们深入了解一下Ext Grid。Ext Grid是一种用于展示和操作大量结构化数据的...
将页面的GridPanel中的数据导出到Excel中 测试Ext:版本2.2.1 支持GridSummary,GroupSummary和GroupHeaderPlugin插件 使用方法: 1)把三个JS文件引入到页面中 2)调用例句: var data2Excel = new Ext.icss.Data2...