Export Html Table to .xlsx, .xls, .csv and .txt using jQuery Plugin – TableExport.js

Export Html Table to .xlsx, .xls, .csv and .txt using jQuery Plugin – TableExport.js
Are you looking for a jQuery plugin which export your HTML table into .xlsx, .xls, .csv and .txt file? If yes then here I am going to share jQuery plugin TableExport.js which allow you to quickly and dynamically convert HTML tables into excel spreadsheets .xlsx,.xls, .csv and .txt in only one line of code.
Export Html Table to .xlsx, .xls, .csv and .txt

Libraries

Include all the following css+js libraries on page where you have to add export to .xls, .csv and .txt feature.

<!--CSS-->
<link href="tableexport.min.css" rel="stylesheet" type="text/css">
 
<!--JS-->
<script src="//code.jquery.com/jquery-latest.min.js"></script>
<script src="FileSaver.min.js"></script>
<script src="tableexport.min.js"></script>

Additional Libraries
In order to provide Office Open XML SpreadsheetML Format ( .xlsx ) support, you must include the xls.core.min.js third-party library in your project before both FileSaver.js and TableExport. To support legacy browsers ( Chrome < 20, Firefox < 13, Opera < 12.10, IE < 10, Safari < 6 ) include the Blob.js polyfill before the FileSaver.js script.

<script src="Blob.min.js"></script>
<script src="xls.core.min.js"></script>



HTML

Sample html table which need to export to .xls, .csv and .txt

<table id="employee-salary" width="70%" class="table table-striped">
            <thead>
            <tr>
                <th>
 
                    Name
 
                </th>
                <th>Position</th>
                <th>Age</th>
                <th>Salary</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>Thor Walton</td>
                <td>Regional Director</td>
                <td>45</td>
                <td>$98,540</td>
            </tr>
            <tr>
                <td>Travis Clarke</td>
                <td>Software Engineer</td>
                <td>30</td>
                <td>$275,000</td>
            </tr>
            <tr>
                <td>Suki Burks</td>
                <td>Office Manager</td>
                <td>22</td>
                <td>$67,670</td>
            </tr>
            </tbody>
            <tfoot>
            <tr>
                <td class="disabled"></td>
                <td class="disabled"></td>
                <td class="disabled"></td>
                <th>$441,210</th>
            </tr>
            </tfoot>
        </table>

table id will be auto set as file name whenever you export table.


JS

To use this library, simple call the TableExport constructor:

new TableExport(document.getElementsByTagName("table"));
 

 
TableExport(document.getElementsByTagName("table"));
 

 
$("table").tableExport();

Additional properties can be passed-in to customize the look and feel of your tables, buttons, and exported data.

$("table").tableExport({
    headers: true,                              // (Boolean), display table headers (th or td elements) in the <thead>, (default: true)
    footers: true,                              // (Boolean), display table footers (th or td elements) in the <tfoot>, (default: false)
    formats: ['xlsx', 'csv', 'txt'],            
    filename: 'id',                             
    bootstrap: false,                           
    exportButtons: true,                        
    position: 'bottom',                         
    ignoreRows: null,                           
    ignoreCols: null,                           
    trimWhitespace: true                        
});

See live demo and download source code.

DEMO | DOWNLOAD

Visit official github repository for more information and follow for future updates. Don’t forget to read license for using this plugin in your projects.