How to export table from HTML to Excel and arrange images in cells
Asked Answered
D

0

2

I need to export table from HTML to Excel.

My table consists of Name, Age, Date, Amount and Image column with small image.

I have a function that generates an excel document:

function downloadsalesreport() {
    var cache = {};

    this.tmpl = function tmpl(str, data) {
        // Figure out if we're getting a template, or if we need to
        // load the template - and be sure to cache the result.
        var fn = !/\W/.test(str)
            ? cache[str] = cache[str] || tmpl(document.getElementById(str).innerHTML)

            // Generate a reusable function that will serve as a template
            // generator (and which will be cached).
            : new Function(
                "obj",
                "var p=[],print=function(){p.push.apply(p,arguments);};"
                // Introduce the data as local variables using with(){}
                + "with(obj){p.push('"
                // Convert the template into pure JavaScript
                + str.replace(/[\r\t\n]/g, " ")
                    .split("{{").join("\t")
                    .replace(/((^|}})[^\t]*)'/g, "$1\r")
                    .replace(/\t=(.*?)}}/g, "',$1,'")
                    .split("\t").join("');")
                    .split("}}").join("p.push('")
                    .split("\r").join("\\'")
                + "');}return p.join('');"
            );

        // Provide some basic currying to the user
        return data ? fn(data) : fn;
    };


    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]--></head><body>{{for(var i=0; i<tables.length;i++){ }}<table>{{=tables[i]}}</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 (tableList, name) {
            if (!tableList.length > 0 && !tableList[0].nodeType) table = document.getElementById("#tablesalesentry")
            var tables = [];
            for (var i = 0; i < tableList.length; i++) { tables.push(tableList[i].innerHTML); }
            var ctx = { worksheet: name || 'Worksheet', tables: tables };
            window.location.href = uri + base64(tmpl(template, ctx))
        }
    })();

    tableToExcel(document.getElementsByTagName("table"), "one");

}

It works perfectly but my problem is in Excel: images are not aligned properly.

In Excel cells which consists of images are collapsed but remaining data (Name, Age, Date, Amount) are perfectly arranged.

Please suggest me any idea regarding export table to excel.

Denten answered 23/10, 2013 at 10:34 Comment(2)
nice code thank you! how to change the filename and add the .xls extensions?Pyre
Does this work in IE?Harem

© 2022 - 2024 — McMap. All rights reserved.