Export HTML Table to XLS

Selamat malam teman-teman, hehe… seperti biasa ada aja kalo mau nulis selalu aja ada ide.. hehe…ini sebenernya tugas kantor. Nah, latar belakang kali ini dimana kita membuat export excel namun letaknya ada di controller CodeIgniter. Saya tidak menampilkan data pada Views, sebab data yang ditampilan untuk keperluan data AJAX. Saya pikir ini akan sulit sekali, namun untungnya HTML5 memang luar biasa. Ikuti saja yuk langkah-langkahnya.

Langkah-1,  buatlah button namakan id btnExport

<p align="right"><button id="btnExport">Export</button></p>

Langkah-2, namakan table dan berikan nama id table_wrapper

<table id='table_wrapper' width='100%' class='table table-bordered table-condensed'>

Langkah-3, buat script javascriptnya.

 $(document).ready(function() {
 $("#btnExport").click(function(e) {
 e.preventDefault();

//getting data from our table
 var data_type = 'data:application/vnd.ms-excel';
 var table_div = document.getElementById('table_wrapper');
 var table_html = table_div.outerHTML.replace(/ /g, '%20');

var a = document.createElement('a');
 a.href = data_type + ', ' + table_html;
 a.download = 'exported_table_' + Math.floor((Math.random() * 9999999) + 1000000) + '.xls';
 a.click();
 });
});

done, hasil:

Terimakasih teman-teman semoga membantu 🙂

reference:
https://codepen.io/kostas-krevatas/pen/mJyBwp