如何将Datatables表导出到Excel中，该工作在IE中也是如此 [英] How to export Datatables table to Excel which works in IE as well

问题描述

我正在使用

  var tableToExcel =（function（）{
 var uri ='data：application / vnd.ms-excel; base64，'
，template ='< html xmlns：o =urn：schemas-microsoft-com：office：officexmlns：x =urn：schemas-microsoft-com：办公室：excelxmlns =http://www.w3.org/TR/REC-html40>< 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]  - >< meta http-equiv =content-type =text / plain; charset = UTF-8/>< / head>< body>< table> {table}< / 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]; 
}）
}; 
 return function（table，fileName）{
 if（！table.nodeType）table = document.getElementById（table）
 var ctx = {
工作表：fileName || '工作表'，
表：table.innerHTML 
} 
 $（< a id ='dlink'style ='display：none;'>< / a>） .appendTo（body）; 
 document.getElementById（dlink）。href = uri + base64（format（template，ctx））
 document.getElementById（dlink）。 
 document.getElementById（dlink）。click（）; 
} 
}）（）; 
  

用于将数据表导出为ex​​cel，它在chrome和firefox中都可以正常工作。

传递给系统调用的数据区域太小。

$ b所有IE版本中的$ b

错误。请给我一些解决方法，以解决这个问题或建议任何新的方法，在所有的浏览器。我从昨天开始就一直在聊天，但都是徒劳的...
任何帮助都将被释放..谢谢

：编辑我已经试过downloadify.js ，文件夹，但没有为我工作。

解决方案

我使用jspdf获得所需的结果。

  1）这适用于所有版本的IE。 
 2）您可以在Excel 
  

中给出冻结列和冻结行选项。 / p>

我使用的库

  1） downloadify.js 
 2）swfobject.js 
 3）downloadify.swf 
  

我使用的功能

  1）getHtmlForExport（）; //给出要导出的表的html。 
 2）tableToExcel（）; //将html代码转换为Microsoft Excel特定的XML代码
 3）handleExcelExport（）; //将excel特定的XML下载到excel文件。 
 
 
 var tableToExcel = function（table，horizo​​ntalFreezeRowNo，VerticalFreezeRowNo）{
 var worksheetString =''; 
 //工作表冻结窗格选项
 workheetString + ='< x：WorksheetOptions xmlns =urn：schemas-microsoft-com：office：excel>< x：Selected />< x：FreezePanes />< x：FrozenNoSplit />< x：ActivePane> 2< / x：ActivePane> 
 if（horizo​​ntalFreezeRowNo！== undefined）
 workheetString + ='< x：SplitHorizo​​ntal>'+ horizo​​ntalFreezeRowNo +'< / x：SplitHorizo​​ntal>< x：TopRowBottomPane>'+ horizo​​ntalFreezeRowNo +' ; / x：TopRowBottomPane>'; 
 if（VerticalFreezeRowNo！== undefined）
 workheetString + ='< x：SplitVertical>'+ VerticalFreezeRowNo +'< / x：SplitVertical>< x：LeftColumnRightPane>'+ VerticalFreezeRowNo +' ; / x：LeftColumnRightPane>'; 
 
 workheetString + ='< / x：WorksheetOptions>'; 
 
 var template ='< html xmlns：o =urn：schemas-microsoft-com：office：officexmlns：x =urn：schemas-microsoft-com：office：excelxmlns =http://www.w3.org/TR/REC-html40>< head><！ -  [if gte mso 9]>< xml>< x：ExcelWorkbook>< x ：ExcelWorksheets>< x：ExcelWorksheet>< x：Name> {worksheet}< / x：Name>< x：WorksheetOptions>< x：DisplayGridlines />< / x：WorksheetOptions>'+ worksheetString + '< / x：ExcelWorksheet>< / x：ExcelWorksheets>< / x：ExcelWorkbook>< / xml><！[endif]  - >< meta http-equiv =content-type =text / plain; charset = UTF-8/>< / head>< body>< table> {table}< / table>< / body>< / html>'
 
，format = function（s，c）{
 return s.replace（/ {（\w +）} / g，function（m，p）{
 return c [ ]; 
}）
}; 
 if（！table.nodeType）
 table = document.getElementById（table）
 var ctx = {
表：table.innerHTML 
} 
 $ （#exportTable）。remove（）; 
返回格式（模板，ctx）
} 
 
函数handleExcelExport（gridConfig）{
 $（。+ gridConfig.objectID +导出）downloadify （{
 filename：function（）{
 var elementClicked = this.el; 
 var headerText = $（elementClicked）.parents（'。portlet'）。 h8'）。text（）; 
 var fileName; 
 if（elementClicked == undefined || headerText == undefined）{
 fileName =excel
} else {
 fileName = headerText.toString（）。trim（）
} 
 return fileName +.xls; 
}，
 data：function（）{
 var elementClicked = this.el; 
 
 getHtmlForExport（elementClicked，gridConfig）; 
 return（tableToExcel（'exportTable'，1，1））; // table id，horizo​​ntal freeze，vertical冻结
}，
 onComplete：function（）{
 
 }，
 onCancel：function（）{
 
}，
 onError：function（）{
 
}，
 swf：'resources /js/downloadify/downloadify.swf'，
 downloadImage：'resources / css / images / excelDownload.png'，
 width：65，
 height：20，
 transparent： true，
 append：false 
}）; 
} 
  

而对于 getHtmlForExport ，您必须编写逻辑获取要导出的表的HTML。

I am using

  var tableToExcel = (function() {
        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"><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]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></head><body><table>{table}</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];
            })
        };
        return function(table, fileName) {
            if (!table.nodeType) table = document.getElementById(table)
            var ctx = {
                worksheet: fileName || 'Worksheet', 
                table: table.innerHTML
            }
            $("<a id='dlink'  style='display:none;'></a>").appendTo("body");
                document.getElementById("dlink").href = uri + base64(format(template, ctx))
                document.getElementById("dlink").download = fileName;
                document.getElementById("dlink").click();
        }
    })();

for exporting datatables to excel and it works fine in both chrome and firefox. however it gives

The data area passed to a system call is too small.

error in all IE versions. Please give me some workaround as how to solve this problem or suggest any new method that works in all browsers. I am googling about the same since yesterday but all in vain... Any help would be apperciated .. thanks

:Edit i have tried downloadify.js, filesaver but didn't worked for me .

解决方案

I used jspdf to get the desired results.Following points i achieved:-

1) This works in all versions of IE.
2) You can give the freeze column and freeze row options also in Excel

.

Libraries I used

1)downloadify.js 
2)swfobject.js
3)downloadify.swf

Functions i used

1)getHtmlForExport(); // gives the html of the table to be exported.
2)tableToExcel();// converts html code to Microsoft Excel specific XML code
3)handleExcelExport();// downloads excel specific XML to excel file.


var tableToExcel = function (table, horizontalFreezeRowNo, VerticalFreezeRowNo) {
    var worksheetString = '';
    //worksheet freeze pane options 
    worksheetString += '<x:WorksheetOptions xmlns="urn:schemas-microsoft-com:office:excel"><x:Selected/><x:FreezePanes/><x:FrozenNoSplit/><x:ActivePane>2</x:ActivePane>';
    if (horizontalFreezeRowNo !== undefined)
        worksheetString += '<x:SplitHorizontal>' + horizontalFreezeRowNo + '</x:SplitHorizontal><x:TopRowBottomPane>' + horizontalFreezeRowNo + '</x:TopRowBottomPane>';
    if (VerticalFreezeRowNo !== undefined)
        worksheetString += '<x:SplitVertical>' + VerticalFreezeRowNo + '</x:SplitVertical><x:LeftColumnRightPane>' + VerticalFreezeRowNo + '</x:LeftColumnRightPane>';

    worksheetString += '</x:WorksheetOptions>';

    var 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"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions>' + worksheetString + '</x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></head><body><table>{table}</table></body></html>'

    , format = function (s, c) {
        return s.replace(/{(\w+)}/g, function (m, p) {
            return c[p];
        })
    };
    if (!table.nodeType)
        table = document.getElementById(table)
    var ctx = {
        table: table.innerHTML
    }
    $("#exportTable").remove();
    return format(template, ctx)
}

function handleExcelExport(gridConfig) {
    $("." + gridConfig.objectID + "Export").downloadify({
        filename: function () {
            var elementClicked = this.el;
            var headerText = $(elementClicked).parents('.portlet').find('.portlet-title h8').text();
            var fileName;
            if (elementClicked == undefined || headerText == undefined) {
                fileName = "excel"
            } else {
                fileName = headerText.toString().trim()
            }
            return fileName + ".xls";
        },
        data: function () {
            var elementClicked = this.el;

            getHtmlForExport(elementClicked, gridConfig);
            return (tableToExcel('exportTable', 1, 1));// table id, horizontal freeze,vertical freeze 
        },
        onComplete: function () {

        },
        onCancel: function () {

        },
        onError: function () {

        },
        swf: 'resources/js/downloadify/downloadify.swf',
        downloadImage: 'resources/css/images/excelDownload.png',
        width: 65,
        height: 20,
        transparent: true,
        append: false
    });
}  

and for getHtmlForExport you have to write the logic to get the html of table you want to export .

这篇关于如何将Datatables表导出到Excel中，该工作在IE中也是如此的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！