Cara menggunakan datatable ajax php

Datatable adalah sebuah plugin javascript yang menawarkan semua fitur tabel yang dibutuhkan dalam pembuatan sebuah aplikasi. Hadirnya datatable membuat programmer tidak perlu membuat fitur pencarian, pagination, ordering, dan fitur berapa maksimal jumlah data yang ditampilkan per-rownya. Implementasinya sangat mudah sekali, tutorialnya bisa kalian baca di link ini //www.sahretech.com/2020/04/cara-membuat-pencarian-sorting-dan.html



Tetapi yang menjadi kendala saat menggunakan datatable yaitu, semua data akan di-load di satu halaman yang sama, saat kalian memiliki ratusan bahkan ribuan data, loading halaman pun menjadi lambat dan cara seperti ini jelas tidak efektif. Maka solusinya adalah menggunakan datatable serverside, konfigurasinya memang sedikit rumit bagi yang baru tahu, tapi tenang saja, saya akan mengulasnya dengan mudah. Berikut cara implementasi datatable serverside dengan php dan mysql.


Cara Menggunakan Datatable Serverside

  • 1. Buat sebuah database dengan nama latihan, lalu buat sebuah tabel user di dalamnya dengan struktur seperti gambar di bawah ini. Dan jangan lupa untuk mengisi data dummy di dalamnya.
Struktur Tabel User


  • 2. Buat sebuah folder baru di dalam htdocs, lalu beri nama serverside.
  • 3. Buat sebuah file di dalam folder serverside dengan nama index.php. Lalu ikuti script-nya seperti di bawah ini.






            No
            username
            password
            telpon
            alamat
            action
        
$[document].ready[function[] { $['#example'].DataTable[ { "processing": true, "serverSide": true, "ajax": "data.php", "order": [[ 0, 'asc' ]], // membuat kolom "columns": [ //untuk membuat data index { data: 'no', name:'id', render: function [data, type, row, meta] { return meta.row + meta.settings._iDisplayStart + 1; }}, //samakan data kolom sesuai dt di data.php { "data": 'username' }, { "data": 'password' }, { "data": 'notelp' }, { "data": 'alamat' }, { "data": 'aksi' }, ] } ]; } ];


  • 4. Buat sebuah file baru bernama data.php. Lalu ikuti script-nya seperti di bawah ini.


Bài mới nhất

Chủ Đề