在程序实现之前首先要做的就是打开一个IE点击“工具栏--Internet选项--安全选项卡--Internet--自定义级别--将其中的所有与ActiveX有关的项目点为启用”同时确保你的机器上已经安装了excel。
aa.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>extjs初级--panel(老式写法)</title>
<link rel="stylesheet" type="text/css"
href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js">
</script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript" src="test/hhh.js"></script>
</head>
<body>
<div id='aaa'>
<div id='aa'></div>
</div>
</body>
</html>
hhh.js
Ext.onReady(function() {
var centersm = new Ext.grid.CheckboxSelectionModel();
var centercm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
centersm, {
header : "rid",
width : 100,
hidden : true,
align : "center",
dataIndex : "rid"
}, {
header : "角色",
width : 110,
align : "center",
dataIndex : "rolename"
}]);
var centerdata = [{
rid : 423,
rolename : "管理员"
}, {
rid : 434,
rolename : "库管"
}, {
rid : 546,
rolename : "采样员"
}, {
rid : 778,
rolename : "注射员"
}, {
rid : 443,
rolename : "化验员"
}]
var centerproxy = new Ext.data.MemoryProxy(centerdata);
var centeruser = Ext.data.Record.create([{
name : "rid",
type : "int",
mapping : "rid"
}, {
name : "rolename",
type : "string",
mapping : "rolename"
}]);
var centerreader = new Ext.data.JsonReader({}, centeruser);
var centerstore = new Ext.data.Store({
proxy : centerproxy,
reader : centerreader,
autoLoad : true
});
var grid = new Ext.grid.GridPanel({
region : "center",
renderTo : Ext.getBody(),
store : centerstore,
cm : centercm,
sm : centersm,
id : "centerid",
height : 200,
loadMask : {
msg : '正在加载数据,请稍后...'
},
bodyStyle : "width:33%",
autoWidth : true,
tbar : [{
text : "打印",
id : "aaa",
icon : "test/image/vcard.png",
cls : "x-btn-text-icon",
handler : function(){
downloadViewData(grid);
}
}]
});
function downloadViewData(grid) {
try {
var xls = new ActiveXObject("Excel.Application");
} catch (e) {
alert("要打印该表,您必须安装Excel电子表格软件,同时浏览器须使用“ActiveX 控件”,您的浏览器须允许执行控件。 请点击【帮助】了解浏览器设置方法!");
return "";
}
var cm = grid.getColumnModel();
var colCount = cm.getColumnCount();
xls.visible = true; // 设置excel为可见
var xlBook = xls.Workbooks.Add;
var xlSheet = xlBook.Worksheets(1);
var temp_obj = [];
// 只下载没有隐藏的列(isHidden()为true表示隐藏,其他都为显示)
// 临时数组,存放所有当前显示列的下标
for (i = 2; i < colCount; i++) {
if (cm.isHidden(i) == true) {
} else {
temp_obj.push(i);
}
}
for (i = 1; i <= temp_obj.length; i++) {
// 显示列的列标题
alert(cm.getColumnHeader(temp_obj[i - 1]));
xlSheet.Cells(1, i).Value = cm.getColumnHeader(temp_obj[i - 1]);
}
var store = grid.getStore();
var recordCount = store.getCount();
var view = grid.getView();
for (i = 1; i <= recordCount; i++) {
for (j = 1; j <= temp_obj.length; j++) {
// EXCEL数据从第二行开始,故row = i + 1;
xlSheet.Cells(i + 1, j).Value = view.getCell(i - 1, temp_obj[j
- 1]).innerText;
}
}
xlSheet.Columns.AutoFit;
xls.ActiveWindow.Zoom = 75
xls.UserControl = true; // 很重要,不能省略,不然会出问题 意思是excel交由用户控制
xls = null;
xlBook = null;
xlSheet = null;
}
})
分享到:
相关推荐
extjs4打印grid插件,官网上的一个例子程序,有需要的人可以下载来看看。
Extjs动态Grid的生成 htm
这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹,其余文件过大并且与主题无关,因此未包含。具体方法,请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》
ExtJS grid过滤操作,可以动态操作本地的store更改筛选的内容
使用ExtJs相关的控件类自己实现的一个ExtJs的Grid列表的导出功能,可以导出列表的相关样式等
基于Extjs4官方的例子,做了一个关于MVC和Grid增删改的小例子
extjs grid示例代码extjs grid示例代码extjs grid示例代码extjs grid示例代码
extjs4 grid 包括form js代码
ExtJs 4.0 Grid 单元格合并控件封装
Extjs4 grid 导出为Excel 下载后放在网站(不放在网站中导出按钮不能会点击无响应,因为这里调用了swf文件)里可直接运行index.html测试 <link href='...
EXTJS4 GRID 表格 分页 编辑 添加判断 颜色判断 分组 等示例
Extjs 中想改变grid 行高,如果只是简单的设置了height的值是可以实现grid 的行高,但是如果使用了插件:rowexpander ,最出现新的问题。 感兴趣的朋友可以试试的。 此文档可以解决你的烦恼,为了找到资源下载,...
ExtJs Grid是否选择行,是:返回选择行record;否:返回false
EXTJS grid导出EXCEL文件,源码可以直接导入MYECLIPSE使用,EXTJS版本3.2.0
ExtJS框架
extjs grid 多表头 插件 extjs grid 多表头 插件
ExtJs_grid.txt grid使用总结
title的header表头名、width宽度、dataIndex映射名都可以根据外部定义的xml进行读取,便于将ExtJs的Grid封装
Extjs4下拉菜单中用Grid显示,有单选,和多选两个控件,完美通用代码控件,绝对让你好用,值得收藏^-^
自己写的一个Extjs Grid2Grid拖拽