Can't export HTML table to Excel when using attributes on the table elements

Question

I'm trying to export an HTML table to Excel using this easy function that I found on the internet:

$("#btnExport").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + $('#tabla_datos').html());
    e.preventDefault();
});

It works pretty well, but when I add an attribute to any elements in my table, like rowspan or colspan, the Excel does not export correctly.

Here's the HTML:

<div id="tabla_datos">
<table>
    <tr>
        <th>Columna 1</th>
        <th>Columna 2</th>
        <th>Columna 3</th>
    </tr>
    <tr>
        <td colspan='2'>Dato 1</td>
        <td>Dato2</td>
   </tr>
   <tr>
        <td>Dato 3</td>
        <td>dato 4</td>
        <td>Dato5</td>
   </tr>
</table>
</div>

<input type="button" id="btnExport" value=" Export Table data into Excel " />

And here's the jsfiddle: http://jsfiddle.net/WAR2v/

I am facing same problem aslo while opening file it generates error that file might have different format than specified i.e "xsl" and no grid lines of this generated excel also disappears....... — Umair Aziz
– Umair Aziz, Commented Feb 20, 2013 at 9:52

Nicros · Accepted Answer · 2013-03-26 19:21:48Z

1

A bit late, but did you try to encode your URI?

This code works for me:

$("#btnExport").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + encodeURIComponent($('#tabla_datos').html()));
    e.preventDefault();
});

answered Mar 26, 2013 at 19:21

Nicros

5,21312 gold badges62 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Can't export HTML table to Excel when using attributes on the table elements

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related