Datatables

Menambahkan Export Excel di Datatables

1 min read
Menambahkan Export Excel di Datatables

Berikut adalah kode lengkap dengan semua file JavaScript yang dibutuhkan untuk tombol Excel, PDF, Copy, dan Print di datatables.

<html>
<head>
<title>Export to Excel and PDF with DataTables</title>
<link href=”https://cdn.datatables.net/1.10.25/css/jquery.dataTables.min.css” rel=”stylesheet” type=”text/css”>
<link href=”https://cdn.datatables.net/buttons/1.7.1/css/buttons.dataTables.min.css” rel=”stylesheet” type=”text/css”>
</head>
<body>
<table id=”example” class=”display nowrap” style=”width:100%”>
<!– Your table data goes here –>
</table>

<script src=”https://code.jquery.com/jquery-3.5.1.js”></script>
<script src=”https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js”></script>
<script src=”https://cdn.datatables.net/buttons/1.7.1/js/dataTables.buttons.min.js”></script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js”></script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js”></script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js”></script>
<script src=”https://cdn.datatables.net/buttons/1.7.1/js/buttons.html5.min.js”></script>
<script src=”https://cdn.datatables.net/buttons/1.7.1/js/buttons.print.min.js”></script>
<script>
$(document).ready(function() {
$(‘#example’).DataTable({
dom: ‘Bfrtip’,
buttons: [
‘excel’, ‘pdf’, ‘copy’, ‘print’
]
});
});
</script>
</body>
</html>

Dalam kode di atas, kita menambahkan beberapa file JavaScript tambahan untuk plugin Buttons, JSZip (yang diperlukan untuk membuat file Excel), pdfmake (yang diperlukan untuk membuat file PDF), dan tombol print. Selamat mencoba!


Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Related Posts

×