jQuery TableHTMLExport Plugin

Jquery plugin that exports an HTML table to JSON, CSV, TXT, or PDF and force the browser to download the generated file.

Live Demo

#	First	Last	Handle
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

How to Use

Add the css below to your html page

<link rel="stylesheet" media="all" href="bootstrap4.min.css" />

Create a container where you want to render table

<table class="table" id="example">
    <thead class="thead-dark">
        <tr>
            <th scope="col">#</th>
            <th scope="col">First</th>
            <th scope="col">Last</th>
            <th scope="col">Handle</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th scope="row">1</th>
            <td>Mark</td>
            <td>Otto</td>
            <td>@mdo</td>
        </tr>
        <tr>
            <th scope="row">2</th>
            <td>Jacob</td>
            <td>Thornton</td>
            <td>@fat</td>
        </tr>
        <tr>
            <th scope="row">3</th>
            <td>Larry</td>
            <td>the Bird</td>
            <td>@twitter</td>
        </tr>
    </tbody>
</table>
<p class="lead">
    <button id="json" class="btn btn-primary">TO JSON</button>
    <button id="csv" class="btn btn-info">TO CSV</button>
    <button id="pdf" class="btn btn-danger">TO PDF</button>
</p>

Load jQuery library together with the TableHTMLExport library into your code

<script src="src/slim.min.js"></script>
<script src="src/jspdf.min.js"></script>
<script src="src/jspdf.plugin.autotable.min.js"></script>
<script src="src/tableHTMLExport.js"></script>
<script>
    $('#json').on('click', function () {
        $("#example").tableHTMLExport({
            type: 'json',
            filename: 'sample.json'
        });
    })
    $('#csv').on('click', function () {
        $("#example").tableHTMLExport({
            type: 'csv',
            filename: 'sample.csv'
        });
    })
    $('#pdf').on('click', function () {
        $("#example").tableHTMLExport({
            type: 'pdf',
            filename: 'sample.pdf'
        });
    })
</script>