[trick] Export Table Ke Format Excel

Bismillah…

Huft… saking belaga sibuk gw jadi jarang update post ..hahaha, kali ini mau kasih trick simple ajah dan udah buanyak di internet, yee, kan buat catetan gw ini sih …😛

Okeh, sesuai judul … kita asumsikan data yang mau kita export kayak gambar dibawah ini:

export-eksel

Noh ada tombol ‘Excel’ kan, kalo dipencet nanti ngedownload sendiri .. formatnya kayak gambar ini:

export-eksel-2

Kurang lebih script table nya gini:

<table class="table table-bordered" width="100%" id="tblExport">
// content here
</table>

penjelasan: disini kita kasih id table nya “tblExport” yang akan digunakan untuk fungsi export… lanjut… kita buat link download… berikut scriptnya.

<a class="btn btn-success" id="eks">Excell</a>

nah, ibarat kata kita ngedownload file, dengan bantuan jquery … fungsi click(), lanjut di script javascript nyah.

  $("#eks").click(function () {
    var m_names = new Array("Januari", "Februari", "Maret",
      "April", "Mei", "Juni", "Juli", "Agustus", "September",
      "Oktober", "November", "Desember");

    var Name = 'Evaluasi-Yanmed-';
    var d = new Date();
    var curr_date = d.getDate();
    var curr_month = d.getMonth();
    var curr_year = d.getFullYear();
    var blobURL = tableToExcel('tblExport');
    $(this).attr('download',Name+curr_date + "-" + m_names[curr_month]+ "-" + curr_year+'.xls')
    $(this).attr('href',blobURL);
  });

UPDATED:

var tableToExcel = (function() {
  var uri = 'data:application/vnd.ms-excel;base64,'
    , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
    , base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }
    , format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) }
  return function(table, name) {
    if (!table.nodeType) table = document.getElementById(table)
    var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}
    var blob = new Blob([format(template, ctx)]);
  var blobURL = window.URL.createObjectURL(blob);
    return blobURL;
  }
})();

Done… simple kok dipahamin… bisa juga pake plugin jquery tapi kalo di linux extensi XLS gak kebaca alias gak ada format nyah makanya fungsi sederhana ini berfungsi di LINUX ataupun WINDOWS dan gw udah coba.

Semoga Bermangfaat..

Have a nice day!

Leave a comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: