Cara Pasang Jquery Datatable di Framework Codeigniter

Halo sobat sobat dumenity, selamat datang di panduan panduan pemrogramman blog Source Code Aplikasi, kali ini kita akan belajar Cara Pasang Jquery Datatable di Framework Codeigniter, jquery datatable ini betul-betul bermanfaat bagi membangun data-data kita menjadi rapi di pada sebuah table, dimana table tersebut dapat kita search secara realtime, dapat kita urutkan ascending atau descending, dapat kita atur tampilan jumlah row yang di tampilkan, mulai dari 10 data hingga lebih, dan ada pagination nya pun. menarik bukan teman teman. yuk seketika saja kita praktekan.





saya asumsikan kalian telah paham mengenai basic basic framework codeigniter ini yah. misalnya configurasi database, membangun model, controller, helper, dan passing data ke view yah teman teman. jadi kali ini saya tak menjelaskan itu.



sebalumnya kalian bikin database, tabel seperti berikut



selamat



insert table provinsi tersebut



INSERT INTO `provinsi` VALUES
('11', 'ACEH'),
('12', 'SUMATERA UTARA'),
('13', 'SUMATERA BARAT'),
('14', 'RIAU'),
('15', 'JAMBI'),
('16', 'SUMATERA SELATAN'),
('17', 'BENGKULU'),
('18', 'LAMPUNG'),
('19', 'KEPULAUAN BANGKA BELITUNG'),
('21', 'KEPULAUAN RIAU'),
('31', 'DKI JAKARTA'),
('32', 'JAWA BARAT'),
('33', 'JAWA TENGAH'),
('34', 'DI YOGYAKARTA'),
('35', 'JAWA TIMUR'),
('36', 'BANTEN'),
('51', 'BALI'),
('52', 'NUSA TENGGARA BARAT'),
('53', 'NUSA TENGGARA TIMUR'),
('61', 'KALIMANTAN BARAT'),
('62', 'KALIMANTAN TENGAH'),
('63', 'KALIMANTAN SELATAN'),
('64', 'KALIMANTAN TIMUR'),
('65', 'KALIMANTAN UTARA'),
('71', 'SULAWESI UTARA'),
('72', 'SULAWESI TENGAH'),
('73', 'SULAWESI SELATAN'),
('74', 'SULAWESI TENGGARA'),
('75', 'GORONTALO'),
('76', 'SULAWESI BARAT'),
('81', 'MALUKU'),
('82', 'MALUKU UTARA'),
('91', 'PAPUA BARAT'),
('94', 'PAPUA');


kalian bikin controller dengan nama Datatable. dan bikin seperti di bawah ini



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

class Datatable extends CI_Controller {

public function index()
{
$this->load->database();

$data['provinsi'] = $this->db->get('provinsi')->result();

$this->load->view('index', $data);
}
}


dan setelah itu kita bikin file bernama index.php di view.



selamat



dan didalam nya ketika kode berikut



<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?><!DOCTYPE html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>Welcome to CodeIgniter</title>
<link rel=stylesheet type=text/css href=//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css>

</head>
<body>
<div>
<h1>JQuery Datatable</h1>
<table id=myTable class=display width=100%>
<thead>
<tr>
<th>Id Provinsi</th>
<th>Nama Provinsi</th>
</tr>
</thead>
<tbody>
<?php foreach ($provinsi as $prov) { ?>
<tr>
<td width=20%><?php echo $prov->id ?></td>
<td width=80%><?php echo $prov->nama_provinsi ?></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
<!--taruh java script di sini -->
</body>
</html>


bagi javascript nya ketikan seperti berikut



selamat



dan coba jalankan di localhost



selamat



nah seperti yang saya sebutkan sebelumnya, coba kalian lakukan pencarian data, misalnya saya akan mencari data sulawesi karenanya hasil nya hanya data sulawesi yang tampil di tabel,



selamat



pastinya ini betul-betul bermanfaat sekali yah teman teman, demikian panduan Cara Pasang Jquery Datatable di Framework Codeigniter



 



 




Sumber https://kursuswebsite.org

Popular posts from this blog

Perbedaan Antara Keyup dan Keydown Pada jQuery

Membuat Table Warna Berselang dengan PHP