Tutorial DataTable Server-Side Codeigniter 3

DataTable merupakan sebuah plugin library table, untuk menampilkan database dalam tampilan bentuk table. Tentu bagi yang suka coding pasti tau ihwal DataTable ini.

DataTable Server-Side CodeIgniter 3

Disini aku akan memberi kan tutorial perihal DataTable server side processing dengan CodeIgniter 3. Walaupun ada sebuah library DataTable untuk CodeIgniter yang dikembangkan oleh seorang Developer yaitu Ignited DataTable.

Tapi sehabis aku coba menggunakan Ignited DataTable ini hanya bisa berjalan lancar pada CodeIgniter versi 2, Untuk CodeIgniter 3 Ignited DataTable masih banyak bugnya.

Okeh langsung saja ke Tutorialnya, lantaran ini tidak memakai library Ignited DataTable. Disini kita membuat query manual nya bisa di letakan di Model atau Controllernya.

Berikut Coding di Modelnya dengan nama Mdata.php :

<?php
if ( ! defined('BASEPATH')) exit('No direct script access allowed');
Class Mdata extends CI_Model

   var $table = "tbmhs";  //table yang ingin di tampilkan
      var $select_column = array("id", "nim", "nama", "email");  //sesuaikan dengan nama field table
      var $order_column = array(null, "nim", "nama", null, null);  

      function make_query()  
        
           $this->db->select($this->select_column);  
           $this->db->from($this->table);  
           if(isset($_POST["search"]["value"]))  
             
                $this->db->like("nim", $_POST["search"]["value"]);  
                $this->db->or_like("nama", $_POST["search"]["value"]);  
             
           if(isset($_POST["order"]))  
             
                $this->db->order_by($this->order_column[$_POST['order']['0']['column']], $_POST['order']['0']['dir']);  
             
           else  
             
                $this->db->order_by('nim', 'DESC');  
             
        
      function make_datatables()  
           $this->make_query();  
           if($_POST["length"] != -1)  
             
                $this->db->limit($_POST['length'], $_POST['start']);  
             
           $query = $this->db->get();  
           return $query->result();  
        
      function get_filtered_data()  
           $this->make_query();  
           $query = $this->db->get();  
           return $query->num_rows();  
             
      function get_all_data()  
        
           $this->db->select("*");  
           $this->db->from($this->table);  
           return $this->db->count_all_results();  
      

 

?>

Dan Ini untuk Controllernya bernama home.php :

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends CI_Controller 

 function __construct()
 
 parent::__construct();
 $this->load->model('mdata', '', TRUE);
 $this->load->helper(array('form', 'url'));
 

 public function content()
 
  $data['title'] = "Data Crud";
  $data['active'] = "active";
  $this->load->view('head',$data);
  $this->load->view('nav');
  $this->load->view('content');
  $this->load->view('footer');  
 


        function datauser()              
           $fetch_data = $this->mdata->make_datatables();  
           $data = array();  
           foreach($fetch_data as $row)  
             
                $sub_array = array();                  
                $sub_array[] = $row->nim;  
                $sub_array[] = $row->nama;
                $sub_array[] = $row->email;  
                $sub_array[] = '<button type="button" name="update" id="'.$row->nim.'" class="btn btn-info btn-xs update">Update</button>';  
                $sub_array[] = '<button type="button" name="delete" id="'.$row->nim.'" class="btn btn-danger btn-xs delete">Delete</button>';  
                $data[] = $sub_array;  
             
           $output = array(  
                "draw"                    =>     intval($_POST["draw"]),  
                "recordsTotal"          =>      $this->mdata->get_all_data(),  
                "recordsFiltered"     =>     $this->mdata->get_filtered_data(),  
                "data"                    =>     $data  
           );  
           echo json_encode($output);  
        

  

Berikut body => content.php untuk tampilan viewnya

  <body>
  <div class="container">
  <h3>Crud Edit & Delete</h3><hr/>
<div id="info"></div>
   <div class="table-responsive">                                 
     <table id="user_data" class="table table-bordered table-striped">  
      <thead>  
           <tr>  
                <th>NIM</th>  
                <th>Nama</th>  
                <th>Email</th>
                <th>Edit</th>                                                                 
                <th>Delete</th>
           </tr>  
      </thead>  
        </table>  
      </div>  
  </div>    
                 

 <script type="text/javascript" language="javascript">
 $(document).ready(function()  
      var dataTable = $('#user_data').DataTable(  
           "processing":true,  
           "serverSide":true,  
           "order":[],  
           "ajax":  
                url:"<?php echo base_url() .'home/datauser'; ?>",  
                type:"POST"  
           ,  
           "columnDefs":[  
                  
                     "targets":[0, 3, 4],  // sesuaikan order table dengan jumlah column
                     "orderable":false,  
                ,  
           ],  
      );  
     
 );  

 </script>  

Berikut Tutorial Tutorial menciptakan DataTable server side CodeIgniter walaupun agak jlimet ^_^ untuk seorang newbi, tapi mangga di coba.
Sebenarnya hampir sama di untu postingan aku kemarin ihwal validasi Ajax CodeIgniter perihal Crud.
Okeh untuk Link demo berikut hasil nya : Demo DataTable Server Side CodeIgniter Example
Untuk Link Download Berikut : Downlod DataTable Server Side Processing CodeIgniter 3

Okeh Terimakasih biar Bermanfaat