zoukankan      html  css  js  c++  java
  • easyui datagrid导出

    必须使用datagrid-export.js,复制,粘贴

    (function($){
        function getRows(target){
            var state = $(target).data('datagrid');
            if (state.filterSource){
                return state.filterSource.rows;
            } else {
                return state.data.rows;
            }
        }
        function toHtml(target, rows){
            rows = rows || getRows(target);
            var dg = $(target);
            var data = ['<table border="1" rull="all" style="border-collapse:collapse">'];
            var fields = dg.datagrid('getColumnFields',true).concat(dg.datagrid('getColumnFields',false));
            var trStyle = 'height:32px';
            var tdStyle0 = 'vertical-align:middle;padding:0 4px';
            data.push('<tr style="'+trStyle+'">');
            for(var i=0; i<fields.length; i++){
                var col = dg.datagrid('getColumnOption', fields[i]);
                var tdStyle = tdStyle0 + ';'+col.boxWidth+'px;';
                data.push('<th style="'+tdStyle+'">'+col.title+'</th>');
            }
            data.push('</tr>');
            $.map(rows, function(row){
                data.push('<tr style="'+trStyle+'">');
                for(var i=0; i<fields.length; i++){
                    var field = fields[i];
                    data.push(
                        '<td style="'+tdStyle0+'">'+row[field]+'</td>'
                    );
                }
                data.push('</tr>');
            });
            data.push('</table>');
            return data.join('');
        }
    
        function toArray(target, rows){
            rows = rows || getRows(target);
            var dg = $(target);
            var fields = dg.datagrid('getColumnFields',true).concat(dg.datagrid('getColumnFields',false));
            var data = [];
            var r = [];
            for(var i=0; i<fields.length; i++){
                var col = dg.datagrid('getColumnOption', fields[i]);
                r.push(col.title);
            }
            data.push(r);
            $.map(rows, function(row){
                var r = [];
                for(var i=0; i<fields.length; i++){
                    r.push(row[fields[i]]);
                }
                data.push(r);
            });
            return data;
        }
    
        function print(target, param){
            var title = null;
            var rows = null;
            if (typeof param == 'string'){
                title = param;
            } else {
                title = param['title'];
                rows = param['rows'];
            }
            var newWindow = window.open('', '', 'width=800, height=500');
            var document = newWindow.document.open();
            var content = 
                '<!doctype html>' +
                '<html>' +
                '<head>' +
                '<meta charset="utf-8">' +
                '<title>'+title+'</title>' +
                '</head>' +
                '<body>' + toHtml(target, rows) + '</body>' +
                '</html>';
            document.write(content);
            document.close();
            newWindow.print();
        }
    
        function b64toBlob(data){
            var sliceSize = 512;
            var chars = atob(data);
            var byteArrays = [];
            for(var offset=0; offset<chars.length; offset+=sliceSize){
                var slice = chars.slice(offset, offset+sliceSize);
                var byteNumbers = new Array(slice.length);
                for(var i=0; i<slice.length; i++){
                    byteNumbers[i] = slice.charCodeAt(i);
                }
                var byteArray = new Uint8Array(byteNumbers);
                byteArrays.push(byteArray);
            }
            return new Blob(byteArrays, {
                type: ''
            });
        }
    
        function toExcel(target, param){
            var filename = null;
            var rows = null;
            var worksheet = 'Worksheet';
            if (typeof param == 'string'){
                filename = param;
            } else {
                filename = param['filename'];
                rows = param['rows'];
                worksheet = param['worksheet'] || 'Worksheet';
            }
            var dg = $(target);
            var uri = 'data:application/vnd.ms-excel;base64,'
            , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body>{table}</body></html>'
            , base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) }
            , format = function (s, c) { return s.replace(/{(w+)}/g, function (m, p) { return c[p]; }) }
    
            var table = toHtml(target, rows);
            var ctx = { worksheet: worksheet, table: table };
            var data = base64(format(template, ctx));
            if (window.navigator.msSaveBlob){
                var blob = b64toBlob(data);
                window.navigator.msSaveBlob(blob, filename);
            } else {
                var alink = $('<a style="display:none"></a>').appendTo('body');
                alink[0].href = uri + data;
                alink[0].download = filename;
                alink[0].click();
                alink.remove();
            }
        }
    
        $.extend($.fn.datagrid.methods, {
            toHtml: function(jq, rows){
                return toHtml(jq[0], rows);
            },
            toArray: function(jq, rows){
                return toArray(jq[0], rows);
            },
            toExcel: function(jq, param){
                return jq.each(function(){
                    toExcel(this, param);
                });
            },
            print: function(jq, param){
                return jq.each(function(){
                    print(this, param);
                });
            }
        });
    })(jQuery);

    然后,就可以调用语法了

    $("#offlineTable").datagrid('toExcel', 'myExcel.xls');

    toExcel()是方法,后面的是自定义名字

    但是这样只能导出当前的分页数据,那么需要导出前,使用ajax将所有rows数据传递到前台,然后使用

    $("#offlineTable").datagrid('toExcel', {
                            filename: '还阔以.xls',
                            rows: data.rows,
                            worksheet: 'Worksheet'
                        });

    将获取数据的rows覆盖导出的rows,然后就搞定了

    记录编程的点滴,体会学习的乐趣
  • 相关阅读:
    HashMap底层实现原理/HashMap与HashTable区别/HashMap与HashSet区别
    手动部署 Ceph Mimic 三节点
    Ceph 分布式存储架构解析与工作原理
    OpenStack 的单元测试
    OpenStack 虚拟机启动流程 UML 分析(内含 UML 源码)
    我非要捅穿这 Neutron(四)Open vSwitch in Neutron
    手动部署 OpenStack Rocky 双节点
    OpenStack Blazar 架构解析与功能实践
    基于 Open vSwitch 的 OpenFlow 实践
    OpenFlow/SDN 的缘起与发展
  • 原文地址:https://www.cnblogs.com/AduBlog/p/13847370.html
Copyright © 2011-2022 走看看