Membuat Laporan Excel pada PHP – Kita Menggunakan Library jQuery Table2Excel dapat di dowload dan lihat dokumentasinya disini:
https://github.com/rainabba/jquery-table2excel
Bagaimana cara menggunakannya?
1. Pertama buat lah sebuah folder project yang didalamnya terdapat file index.php.
Struktur folder nya seperti gambar di bawah ini:
2. Sertakan Library jQuery dan Plugin jQuery Table2Excel dalam dokumen Html Anda.
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="js/jquery.table2excel.js"></script>
3. Kita tambahkan tombol Export Excel untuk mengekspor data dari tabel html ke file Excel.
<button>Export Excel</button>
3. Kemudian siapkan beberapa data berupa tabel html yang akan di export.
Anda juga bisa menggunakan data dari Database dengan menampilkan ke dalam bentuk tabel terlebih dahulu.
Berikut ini contoh data di dalam format tabel Html:
<table id="myTable">
<tr>
<th>Company</th>
<th>Name</th>
<th>Country</th>
</tr>
<tr>
<td>IBM</td>
<td>Maria</td>
<td>Germany</td>
</tr>
<tr>
<td>TCS</td>
<td>Yen Chang</td>
<td>Mexico</td>
</tr>
<tr>
<td>Microsoft</td>
<td>Roland</td>
<td>Austria</td>
</tr>
<tr>
<td>Wipro</td>
<td>Helen</td>
<td>UK</td>
</tr>
<tr>
<td>Samsung</td>
<td>Yoshwini</td>
<td>Canada</td>
</tr>
<tr>
<td>Virtusa</td>
<td>Rovelli</td>
<td>Italy</td>
</tr>
</table>
4. Kemudian buatlah perintah jQuery berikut untuk menjalankan perintah convert data html ke dalam format excel.
Minimum konfigurasi jQuery Table2Excel seperti kode di bawah ini:
$("button").click(function(){
$("#myTable").table2excel();
});
5. Sehingga full kode dari file index.php menjadi seperi berikut:
<!DOCTYPE html>
<html>
<head>
<title>Ayo Ngoding - Export HTML ke Excel dengan PHP dan jQuery</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="js/jquery.table2excel.js"></script>
</head>
<body>
<h1 style="color:green">www.ayongoding.com</h1>
<button>Export Excel</button>
<table id="myTable" class="table2excel" border="1" cellspacing="0" cellpadding="5">
<p>Ayo Ngoding - Export HTML ke Excel dengan PHP dan jQuery</p>
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>Jena Gaines</td>
<td>Office Manager</td>
<td>London</td>
<td>30</td>
<td>2008/12/19</td>
<td>$90,560</td>
</tr>
<tr>
<td>Quinn Flynn</td>
<td>Support Lead</td>
<td>Edinburgh</td>
<td>22</td>
<td>2013/03/03</td>
<td>$342,000</td>
</tr>
<tr>
<td>Charde Marshall</td>
<td>Regional Director</td>
<td>San Francisco</td>
<td>36</td>
<td>2008/10/16</td>
<td>$470,600</td>
</tr>
<tr>
<td>Haley Kennedy</td>
<td>Senior Marketing Designer</td>
<td>London</td>
<td>43</td>
<td>2012/12/18</td>
<td>$313,500</td>
</tr>
<tr>
<td>Tatyana Fitzpatrick</td>
<td>Regional Director</td>
<td>London</td>
<td>19</td>
<td>2010/03/17</td>
<td>$385,750</td>
</tr>
<tr>
<td>Michael Silva</td>
<td>Marketing Designer</td>
<td>London</td>
<td>66</td>
<td>2012/11/27</td>
<td>$198,500</td>
</tr>
<tr>
<td>Paul Byrd</td>
<td>Chief Financial Officer (CFO)</td>
<td>New York</td>
<td>64</td>
<td>2010/06/09</td>
<td>$725,000</td>
</tr>
<tr>
<td>Gloria Little</td>
<td>Systems Administrator</td>
<td>New York</td>
<td>59</td>
<td>2009/04/10</td>
<td>$237,500</td>
</tr>
<tr>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>41</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>35</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>30</td>
<td>2011/09/03</td>
<td>$345,000</td>
</tr>
<tr>
<td>Yuri Berry</td>
<td>Chief Marketing Officer (CMO)</td>
<td>New York</td>
<td>40</td>
<td>2009/06/25</td>
<td>$675,000</td>
</tr>
<tr>
<td>Caesar Vance</td>
<td>Pre-Sales Support</td>
<td>New York</td>
<td>21</td>
<td>2011/12/12</td>
<td>$106,450</td>
</tr>
<tr>
<td>Doris Wilder</td>
<td>Sales Assistant</td>
<td>Sydney</td>
<td>23</td>
<td>2010/09/20</td>
<td>$85,600</td>
</tr>
</tbody>
</table>
<script>
$("button").click(function(){
$("#myTable").table2excel();
});
</script>
</body>
</html>
6. Sekarang jalankan project php Anda dengan mengakses url berikut pada browser:
http://localhost/html-to-excel/
Hasilnya seperti gambar di bawah ini:
Coba klik tombol Export Excel
Maka file dengan nama table2excel.xls akan di dowload.
Silahkan buka file excel yang baru saja di dowload.
Maka hasilnya seperti berikut ini:
Lanjutan: Konfigurasi jQuery Table2Excel
Sekarang kita akan melihat Fitur-Fitur pada jQuery Table2Excel:
$("#myTable").table2excel({
exclude: ".noExl",
name: "Table2Excel",
filename: "table2excel",
fileext: ".xls",
exclude_img: true,
exclude_links: true,
exclude_inputs: true,
preserveColors: false
});
- exclude – Anda dapat menambahkan kelas CSS ‘noExl‘ ke tag tr mana pun untuk mengabaikan data tabel yang ditentukan saat mengekspor.
- name – Worksheet Name.
- filename – Nama file excel yang di export, Anda tidak perlu menambahkan file extension di bagian filename ini.
- fileext – Extension file export.
- exclude_img – exclude img tags.
- exclude_links – exclude link tags.
- exclude_inputs – exclude input fields.
- preserveColors – set nilai menjadi ‘true‘ jika ingin menampilkan warna background dan warna font sesuai warna di file excel Anda.
Catatan Penting!
jQuery table2excel berjalan pada HTML, PHP, dan jQuery. Sehingga library ini juga bisa di gunakan pada Framework CodeIgniter dan Framework Laravel.
Leave a Reply