本文主要是介绍ExtJs6.0之Grid前端导出Excel,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
该js文件支持三级表头的导出。
引入该js文件,调用grid2Excel(grid, fileName)即可。
- 新建导出按钮
new Ext.create('Ext.button.Button',{ xtype:'button', iconCls:'excel', type: 'excel', text:'保存为Excel', handler:function() { //grid 为Extjs grid对象 //"导出文件名" 为导出的Excel文件的名称 grid2Excel(grid,"项目授权列表"); }
})
- 点击后调用该函数即可。
列出详细代码:
/**
*
* function grid2Excel(grid,filename)
* @param grid Extjs grid panel
* @param filename Excel 文件名称
*
* **/
(function(){ function getExplorer() {var explorer = window.navigator.userAgent ;//ie if (explorer.indexOf("MSIE") >= 0) {return 'ie';}//firefox else if (explorer.indexOf("Firefox") >= 0) {return 'Firefox';}//Chromeelse if(explorer.indexOf("Chrome") >= 0){return 'Chrome';}//Operaelse if(explorer.indexOf("Opera") >= 0){return 'Opera';}//Safarielse if(explorer.indexOf("Safari") >= 0){return 'Safari';} }function export_excel_ie(tableStr, fileName) {//整个表格拷贝到EXCEL中if(getExplorer()=='ie'){var oXL = new ActiveXObject("Excel.Application");/** 设置边框, 1表示最细边框,2表示细边框,4表示粗线。*///oXL.Selection.Borders.Weight = 4;/** 设置边框线 1 实线, -4115 虚线, 4 点划相间线, 5 划线后跟两个点, -4118 点式线, -4119 双线。*///oXL.Selection.Borders.LineStyle = 1;var el4table = document.createElement("div");el4table.innerHTML = tableStr;//创建AX对象excel var oWB = oXL.Workbooks.Add();//获取workbook对象 var xlsheet = oWB.Worksheets(1);//激活当前sheet var sel = document.body.createTextRange();sel.moveToElementText(el4table);//把表格中的内容移到TextRange中 sel.select;//全选TextRange中内容 sel.execCommand("Copy");//复制TextRange中内容 xlsheet.Paste();//粘贴到活动的EXCEL中 oXL.Visible = true;//设置excel可见属性try {var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");}
这篇关于ExtJs6.0之Grid前端导出Excel的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!