Membuat Data Table Di codeigniter
Data Table
Contoh Penerapan Di Php
http://phpsance.blogspot.com/2020/05/data-table-tugas-komputer.html
===========================================
===========================================
Catatan :
1.header.php
<!-- DataTables Design-->
<link rel="stylesheet" href="<?php echo base_url()?>assets/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
<!--/Datatables Desgin-->
2.footer.php
<!-- DataTables -->
<!--Untuk search dan botton-->
<script src="<?php echo base_url()?>assets/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<!--/Untuk search-->
<!--Untuk Tampilan-->
<script src="<?php echo base_url()?>assets/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<!--/Untuk Tampilan-->
<!--Untuk nomor dibawah Dan Serach Diatas-->
<script>
$(function () {
$('#example1').DataTable()
$('#example2').DataTable({
'paging' : true,
'lengthChange': false,
'searching' : false,
'ordering' : true,
'info' : true,
'autoWidth' : false
})
})
</script>
<!---->
3.Cari Folder
assets/bower_components/datatables.net/js/jquery.dataTables.min.js
untuk mengedit serach/cari,halman dll
jquery.dataTables.min.js yang sudah Diedit
===========================================
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
/**
* @package : DataTables - Ruby Pedia
* @author : Fika Ridaul Maulayya <ridaulmaulayya@gmail.com>
* @since : 2017
* @license : https://www.rubypedia.com/
*/
class Web extends CI_Model
{
public function get_all_buku()
{
$query = $this->db->order_by('id','DESC')->get('tb_Data');
return $query->result();
}
}
Buatlah sebuah database baru di, http://localhost/phpmyadmin, beri nama databasenya dengan ci-datatables kemudian import script berikut ini kedalam menu SQL.
model/web.php
defined('BASEPATH') OR exit('No direct script access allowed');
/**
* @package : DataTables - Ruby Pedia
* @author : Fika Ridaul Maulayya <ridaulmaulayya@gmail.com>
* @since : 2017
* @license : https://www.rubypedia.com/
*/
class Web extends CI_Model
{
public function get_all_buku()
{
$query = $this->db->order_by('id','DESC')->get('tb_Data');
return $query->result();
}
}
Controller/home.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
/**
* @package : DataTables - Ruby Pedia
* @author : Fika Ridaul Maulayya <ridaulmaulayya@gmail.com>
* @since : 2017
* @license : https://www.rubypedia.com/
*/
class Home extends CI_Controller {
public function __construct()
{
parent::__construct();
//load model
$this->load->model('web');
}
public function index()
{
//create data array
$data = array(
'title' => 'Data Buku',
'data_buku' => $this->web->get_all_buku()
);
//render view with data
$this->load->view('home',$data);
}
}
view/home.php
<!DOCTYPE html>
<html>
<head>
<title><?php echo $title ?></title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css">
</head>
<body>
<div class="container" style="margin-top: 20px">
<div class="row">
<div class="col-md-12">
<h2 style="text-align: center;margin-bottom: 30px">Data Buku Dengan CodeIgniter & DataTables</h2>
<table id="table_id" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>ID</th>
<th>Nama</th>
<th>Alamat</th>
<th>Posting</th>
<th style="width:125px;">Action
</p></th>
</tr>
</thead>
<tbody>
<?php
$no = 1;
foreach($data_buku as $buku){
?>
<tr>
<td><?php echo $no++;?></td>
<td><?php echo $buku->nama;?></td>
<td><?php echo $buku->alamat;?></td>
<td><?php echo $buku->startDate;?></td>
<td style="text-align: center;">
<button class="btn btn-sm btn-primary" onclick="edit_book(<?php echo $buku->id;?>)"><i class="glyphicon glyphicon-pencil"></i></button>
<button class="btn btn-sm btn-danger" onclick="delete_book(<?php echo $buku->id;?>)"><i class="glyphicon glyphicon-trash"></i></button>
</td>
</tr>
<?php }?>
</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js"></script>
<script type="text/javascript">
$(document).ready( function () {
$('#table_id').DataTable();
} );
</script>
</body>
</html>
******
ketentuan
kode yang warna merah
<!-- <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>-->
Boleh dihapus bila menggangu
follow me to in here
hasil :
Membuat Data Table Di codeigniter
Reviewed by Leo
on
09:04
Rating:
Reviewed by Leo
on
09:04
Rating:
.png)
No comments