Cara Menggunakan Datatables Di Codeigniter

6 min read Jul 26, 2024
Cara Menggunakan Datatables Di Codeigniter

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 ID myTable.
  • 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 dan pageLength 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.