Skip to content

Convert HTML Table to Excel in JavaScript

In most cases, we want to implement an Excel export option in our tables in both static and dynamic HTML pages. Here is a simple solution to do that task easily.

HTML Table

<table>
<thead>
<tr>
<th>S.No.</th>
<th>Student Name</th>
<th>Mark</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>John</td>
<td>30</td>
</tr>
<tr>
<td>002</td>
<td>Austine</td>
<td>43</td>
</tr>
</tbody>
</html>

Export Action Button

<button id="btnExport" onclick="fnExcelReport('excelexportfile.xlsx');">Export Excel</button>

In Footer (JavaScript part)

<script src="https://cdn.jsdelivr.net/gh/linways/table-to-excel@v1.0.4/dist/tableToExcel.js"></script>
<script>
function fnExcelReport(fileName) {
            let table = document.getElementsByTagName("table");
            return TableToExcel.convert(table[0], {
                name: fileName,
                sheet: {
                    name: 'DataSheet'
                }
            });
        }
</script>
See also  How to use PHP Composer

Leave a Reply