Home Web 03-Mengaktifkan Navigasi dan Pencarian pada Datatable

03-Mengaktifkan Navigasi dan Pencarian pada Datatable

1192

Datatabel memiliki keunggulan dalam menampilkan data dalam bentuk tabel. Diantaranya adalah menampilkan tombol navigasi (jumlah data yang ditampilkan, tombol next/previous serta pencarian data), selain itu datatable memiliki fasilitas tombol untuk export data dengan format csv, excel, pdf serta mencetak ke printer. Untuk menampilkan navigasi datatable caranya cukup simple sebagai berikut:

  1. Buka file data_barang.php yang ada di folder application/views/barang.
  2. Tambahkan script <table class=”table data-table”> menjadi <table class=”table data-table” id=”dtable”>
  3. Tambahkan javascript di baris paling bawah setelah </table>, sebagai berikut:
<script>
$('#dtable').DataTable(
    {						
		dom: 'Bfrtip',
		lengthMenu: [[10, 50, 100, 200, -1], [10, 50, 100, 200, "All"]],
		'pageLength': 50,
		'responsive':false,							
        buttons: [
            'pageLength','copy', 'csv', 'excel','pdf','print'					
        ]			
	}
);

</script>

Hasilnya sebagai berikut:

LEAVE A REPLY

Please enter your comment!
Please enter your name here