Cara Menggunakan DataTables di CodeIgniter
DataTables adalah plugin JavaScript yang powerful untuk menampilkan dan mengelola data tabular di website. Plugin ini sangat mudah digunakan dan menyediakan berbagai fitur seperti pencarian, sorting, pagination, dan banyak lagi.
Dalam artikel ini, kita akan membahas bagaimana mengintegrasikan DataTables dengan framework CodeIgniter.
1. Instalasi DataTables
Langkah pertama adalah menginstal DataTables ke dalam proyek CodeIgniter Anda. Anda dapat melakukan ini dengan mendownload file library DataTables dari situs resmi DataTables atau dengan menggunakan CDN:
a. Download:
- Unduh file library DataTables dari
- Ekstrak file library ke folder
assets/js
atau folder JavaScript Anda.
b. CDN:
- Sertakan file JavaScript DataTables dalam header HTML Anda menggunakan CDN:
2. Persiapan Controller dan Model
Berikut adalah contoh struktur controller dan model:
a. Controller:
load->model('Datatables_model');
}
public function index() {
$data['title'] = 'DataTables di CodeIgniter';
$this->load->view('datatables_view', $data);
}
public function get_data() {
$data = $this->Datatables_model->get_data();
echo json_encode($data);
}
}
b. Model:
db->get('your_table');
return $query->result_array();
}
}
Ganti your_table
dengan nama tabel database yang ingin Anda tampilkan di DataTables.
3. View DataTables
Buat file view datatables_view.php
di folder views
Anda:
DataTables di CodeIgniter
DataTables
Nama
Email
Umur
Penjelasan Kode:
$('#myTable').DataTable(...)
: Inisialisasi DataTables untuk tabel dengan IDmyTable
.processing: true
: Menampilkan indikator loading saat DataTables memproses data.serverSide: true
: Memberitahu DataTables bahwa data akan diproses di server.ajax: {...}
: Menentukan URL untuk mengambil data dan metode yang digunakan (POST dalam kasus ini).columns: [...]
: Menentukan kolom yang akan ditampilkan di DataTables dan kolom mana yang sesuai dengan data dari server.
4. Jalankan Aplikasi
Jalankan aplikasi CodeIgniter Anda dan akses halaman datatables/index
. Anda akan melihat tabel data dengan fitur DataTables seperti pencarian, sorting, dan pagination.
5. Penyesuaian DataTables
Anda dapat menyesuaikan DataTables lebih lanjut dengan menambahkan berbagai parameter dan plugin.
a. Menambahkan Fitur:
- Pagination: Gunakan parameter
paging
danpageLength
untuk mengatur jumlah data yang ditampilkan per halaman. - Sorting: Gunakan parameter
order
untuk menentukan kolom mana yang akan disorting secara default. - Pencarian: Gunakan parameter
searching
untuk mengaktifkan atau menonaktifkan fitur pencarian.
b. Menambahkan Plugin:
- DataTables Buttons: Plugin ini memungkinkan Anda menambahkan tombol seperti cetak, export ke Excel, dan PDF ke DataTables.
- DataTables FixedHeader: Plugin ini membekukan header tabel agar tetap terlihat saat Anda menggulir.
Kesimpulan
Dengan mengikuti langkah-langkah di atas, Anda dapat mengintegrasikan DataTables dengan CodeIgniter dan menampilkan data tabel yang interaktif dengan mudah. Anda dapat menyesuaikan fitur dan plugin DataTables sesuai kebutuhan untuk meningkatkan pengalaman pengguna di website Anda.