Cara Membuat CRUD dengan Code Igniter dan MySQL: Menampilkan Data #2
Pada Step ini kita akan membuat cara menampilkan data dari database ke web. Pertama-tama pastikan kalian telah mengikuti step sebelumnya yaitu Setting konfigurasi pada CI, buat yang belum bisa Klik Disini.
Kemudian buka folder Code Igniter kalian, kalau yang ngikutin step mimin dari awal berarti xampp/htdocs/belajarci/
Selanjutnya buka folder application/controllers, lalu kita akan membuat file controllernya, dengan nama mahasiswa.php, dan isi codingnya seperti ini :
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Mahasiswa extends CI_Controller {
public function __construct()
{
parent::__construct();
$this->load->model('m_data');
}
function index(){
$data['mahasiswa'] = $this->m_data->tampil_data();
$this->load->view('v_tampil',$data);
}
}
Pada coding di atas terdapat function construct, dimana fungsi ini akan langsung berjalan ketika program di jalankan. Lalu perhatikan isi pada function construct nya :
parent::__construct();
$this->load->model('m_data');
parent::_construct(), disini berfungsi untuk menjalankan construct pada parent nya, agar menjalankan extends-extends yang diperlukan oleh program, dan $this->load->model('m_data); berfungsi untuk menload model data yang akan kita buat nanti.
$data['mahasiswa'] = $this->m_data->tampil_data();
$this->load->view('v_tampil',$data);
Lalu untuk function indexnya, terdapat $data['mahasiswa'] = $this->m_data->tampil_data(), pada baris ini terdapat $data['mahasiswa'] variabel array yang digunakan untuk menampung return value dari fungsi model tampil_data. Dan $this->load->view('v_tampil',$data), berfungsi untuk menload view yang akan kita gunakan, pada kasus ini view kita menggunakan v_tampil, dan varibel $data untuk menlanjutkan value dari nilai tampil_data nya. Jadi strukturnya ('nama file view',data yang ingin dipakai). Lebih lengkapnya kalian bisa lihat di manual CI nya :
https://www.codeigniter.com/user_guide/general/views.html
https://www.codeigniter.com/user_guide/general/views.html
Selanjutnya buka folder application/models/, disana kita akan membuat file modelnya, dengan nama m_data.php, dan isi codingnya seperti ini :
<?php
class M_data extends CI_Model{
function tampil_data(){
return $this->db->get('mahasiswa')->result();
}
}
Perhatikan pada coding function tampil_data :
return $this->db->get('mahasiswa')->result();
return disini digunakan untuk mengembalikan nilai, nilai apa?. Nilai dari $this->db->get('mahasiswa') dimana fungsi ini untuk mengambil data dari database dari tabel mahasiswa.
Kemudian kita akan membuat tampilan view nya, dimana view ini akan menjadi tampilan untuk data yang akan di tampilkan pada web browser. Buka folder application/views/, buat file viewnya dengan v_tampil.php, isi codingnya seperti ini :
<!DOCTYPE html>
<html>
<head>
<title>Menampilkan Data di CI</title>
</head>
<link rel="stylesheet" type="text/css" href="<?php echo base_url()."css/bootstrap.css" ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url()."css/bootstrap.min.css" ?>">
<body>
<div class="container">
<div class="row justify-content-between">
<div class="col-md-8">
<Strong><h2>Data Mahasiswa</h2></Strong>
<h5><a href="<?php echo base_url("mahasiswa");?>" style="text-decoration: none">Kembali Ke Awal</a> | <a href="<?php echo base_url("mahasiswa/tambah");?>" style="text-decoration: none">Tambah Data</a></h5>
</div>
<form class="form-inline" method="post" action="<?php echo base_url("mahasiswa/cari");?>">
<div class="form-group mx-sm-3 mb-2">
<input type="text" class="form-control" name="kwd" placeholder="Cari ..">
</div>
<button type="submit" class="btn btn-primary mb-2" name="btncari"> Cari </button>
</form>
</div>
<div class="row">
<table class="table table-bordered">
<tr align="center">
<td>No</td>
<td>NIM</td>
<td>Nama</td>
<td>Jenis Kelamin</td>
<td>Alamat</td>
<td colspan="2">Aksi</td>
</tr>
<?php
if(!empty($mahasiswa)){ // Mengecek data kosong atau tidak
$no=1;
foreach($mahasiswa as $data){
echo "<tr align='center'>
<td>$no</td>
<td>".$data->nim."</td>
<td>".$data->nama."</td>
<td>".$data->jeniskelamin."</td>
<td>".$data->alamat."</td>
<td><a href='".base_url("mahasiswa/ubah/".$data->nim)."'>Ubah</a></td>
<td><a href='".base_url("mahasiswa/hapus/".$data->nim)."'>Hapus</a></td>
</tr>";
$no++;
}
}else{ // Jika data kosong
echo "<tr><td align='center' colspan='7'>Data Tidak Ada atau Kosong</td></tr>";
}
?>
</table>
</div>
</div>
</body>
</html>
untuk tambahan css table dan lainnya saya menggunakan bootstrap, kalian bisa menggunakannya juga. Download CSS nya Disini
Kalo sudah di download tinggal Extract saja ke dalam folder belajarci atau folder code igniter kalian, contoh : xampp/htdocs/belajarci/ . Dan refresh browser kalian kembali.
Download Source Filenya
Download Source Filenya
Lihat Part lainnya ( Partnya sudah berurutan ya ini ) :
Baca Postingan lainnya tentang CI yang mungkin berguna untuk kalian :
Artikelnya bagus mudah dipahami, kunjungi website kami juga ya! untuk mendapatkan pengalaman lebih :)
ReplyDelete