Export HTML to Excel using JQuery

Question

that following code is working fine. but when i use <table width=100% id="tb"> like that, it wont work properly. why is that? it will export to excel but not in proper format. is there any way to get it correctly?

HTML:

<input type="button" id="btnExport" value=" Export Table data into Excel " />
<br/>
<br/>
<div id="dvData">
    <table>
        <tr>
            <th>Column One</th>
            <th>Column Two</th>
            <th>Column Three</th>
        </tr>
        <tr>
            <td>row1 Col1</td>
            <td>row1 Col2</td>
            <td>row1 Col3</td>
        </tr>
        <tr>
            <td>row2 Col1</td>
            <td>row2 Col2</td>
            <td>row2 Col3</td>
        </tr>
        <tr>
            <td>row3 Col1</td>
            <td>row3 Col2</td>
            <td><a href="http://www.jquery2dotnet.com/">http://www.jquery2dotnet.com/</a>
            </td>
        </tr>
    </table>
</div>

JS:

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

I checked your code and it is working at my end. Please check the php version at your end. In which browser are you testing this? — Ashish, Mar 15 '16 at 07:03
@Ashish i mean when i use its working fine. bt if i use
it will export to excel/ but not it proper format — tharinducs7, Mar 15 '16 at 07:16
@Ashish try this code by adding this and without adding this http://jsfiddle.net/lesson8/jWAJ7/light/ — tharinducs7, Mar 15 '16 at 07:19
Do you really need to give id to the table as if you give id to the table tag then while exporting to excel it trims all the white spaces and table tag becomes tableid="tb" and thats why it is not working properly. — Ashish, Mar 15 '16 at 07:24
@Ashish i also notice that. is there any way to correct this? or any other script? — tharinducs7, Mar 15 '16 at 07:31
The data URI needs to be URI encoded. `window.open('data:application/vnd.ms-excel,' + encodeURI($('#dvData').html()));` — Axel Richter, Mar 15 '16 at 07:48

Ashish · Accepted Answer · 2016-03-15T07:46:40.993

2

Try this:

window.open('data:application/vnd.ms-excel,' +  encodeURIComponent($('#dvData').html()));

Hope it helps.

edited Mar 15 '16 at 07:46

answered Mar 15 '16 at 07:37

Ashish

468
2
8
24

Thank you very much. its working fine. but it wont show the excel cells. why is that? :) – tharinducs7 Mar 15 '16 at 08:02

score 2 · Answer 2 · edited May 23 '17 at 10:30

2

Source :Export HTML table to excel - using jQuery or Java

I would recommend Apache POI, we've been using it for years, never had any problems.

Alot of examples online to get a good start, and the documentation on the site is also good: http://poi.apache.org/spreadsheet/quick-guide.html

edited May 23 '17 at 10:30

Community

1
1

answered Mar 15 '16 at 07:39

REDEVI_

684
8
18

Export HTML to Excel using JQuery

2 Answers2