CRUD Sederhana Dengan CodeIgniter

Postingan kali ini saya akan sharing cara membuat CRUD sederhana dengan CodeIgniter, CodeIgniter merupakan salah satu PHP framework dengan konsep MVC (Model, View, Controller).

Model View Controller merupakan suatu konsep yang cukup populer dalam pembangunan aplikasi web, berawal pada bahasa pemrograman Small Talk, MVC memisahkan pengembangan aplikasi berdasarkan komponen utama yang membangun sebuah aplikasi seperti manipulasi data, user interface, dan bagian yang menjadi kontrol aplikasi. Terdapat 3 jenis komponen yang membangun suatu MVC pattern dalam suatu aplikasi yaitu :

1. View, merupakan bagian yang menangani presentation logic. Pada suatu aplikasi web bagian ini biasanya berupa file template HTML, yang diatur oleh controller. View berfungsi untuk menerima dan merepresentasikan data kepada user. Bagian ini tidak memiliki akses langsung terhadap bagian model.
2. Model, biasanya berhubungan langsung dengan database untuk memanipulasi data (insert, update, delete, search), menangani validasi dari bagian controller, namun tidak dapat berhubungan langsung dengan bagian view.
3. Controller, merupakan bagian yang mengatur hubungan antara bagian model dan bagian view, controller berfungsi untuk menerima request dan data dari user kemudian menentukan apa yang akan diproses oleh aplikasi.

Dengan menggunakan prinsip MVC suatu aplikasi dapat dikembangkan sesuai dengan kemampuan developernya, yaitu programmer yang menangani bagian model dan controller, sedangkan designer yang menangani bagian view, sehingga penggunaan arsitektur MVC dapat meningkatkan maintanability dan organisasi kode. Walaupun demikian dibutuhkan komunikasi yang baik antara programmer dan designer dalam menangani variabel-variabel yang akan ditampilkan.

Ada beberapa kelebihan CodeIgniter (CI) dibandingkan dengan Kerangka kerja PHP lain,

• Performa sangat cepat : salah satu alasan tidak menggunakan kerangka kerja adalah karena eksekusinya yang lebih lambat daripada PHP from the scracth, tapi Codeigniter sangat cepat bahkan mungkin bisa dibilang codeigniter merupakan kerangka kerja yang paling cepat dibanding kerangka kerja yang lain.
• Konfigurasi yang sangat minim (nearly zero configuration) : tentu saja untuk menyesuaikan dengan database dan keleluasaan routing tetap diizinkan melakukan konfigurasi dengan mengubah beberapa file konfigurasi seperti database.php atau autoload.php, namun untuk menggunakan codeigniter dengan setting standard, anda hanya perlu mengubah sedikit saja file pada folder config.
• Banyak komunitas: dengan banyaknya komunitas CI ini, memudahkan kita untuk berinteraksi dengan yang lain, baik itu bertanya atau teknologi terbaru.
• Dokumentasi yang sangat lengkap : Setiap paket instalasi codeigniter sudah disertai user guide yang sangat bagus dan lengkap untuk dijadikan permulaan, bahasanya pun mudah dipahami.

itulah sedikit pembahasan tentang CodeIgniter dan Konsep MVC dan sekarang kita lanjut ke pokok pembahasan yaitu membuat CRUD sederhana dengan codeigniter, pertama kita download dulu codeigniter-nya di https://codeigniter.com/ , setelah di download ekstrak filenya dan letakkan di folder htdocs dan rename foldernya menjadi ci-app dan coba jalankan localhost/ci-app di browser jika muncul seperti dibawah ini berarti kita sudah bisa mengistall CodeIgniter dan siap untuk digunakan :

sebelum lanjut untuk membuka dan mengubah source code ci-app kita siapkan dulu database untuk menyimpan data, kita buat database di mysql dengan nama ci-app lalu kita buat sebuah table dengan nama mahasiswa dengan struktur seperti berikut :

setelah itu kita buka folder ci-app di code editor, disini saya menggunakan Visual Studio Code dan struktur folder codeigniter seperti berikut :

kita tambahkan satu buah folder baru didalam folder ci-app dengan nama assets dimana didalam folder ini kita akan taru file bootstrap yaitu css dan js, jika teman2 blum punya bootstrap silahkan download langsung di website nya boostrap.

terlihat beberapa file dan folder, namun yang akan kita gunakan untuk menambahkan fitur atau mengembangkan aplikasi kita yaitu folder-folder yang ada di folder application, didalam folder application ini terdapat banyak folder terlihat seperti berikut  :

ok kita setting dulu koneksi kedatabase yang sudah kita buat, kita masuk ke folder confing lalu buka folder database.php dan setting seperti berikut :

silahkan disesuaikan koneksi database sesuai dengan settingan temen-temen, selanjutnya kita tambahkan folder baru di dalam didalam folder views dengan nama mahasiswa dan templates.

didalam folder templates tambahkan dua file yaitu header.php dan footer.php

header.php

<!doctype html>

<html lang="en">

<head>

<!-- Required meta tags -->

<meta charset="utf-8">

<!-- Bootstrap CSS -->

    <link rel="stylesheet" href="<?= base_url(); ?>assets/css/bootstrap.css">

<title><?= $title; ?></title>

</head>

<body>

<nav class="navbar navbar-expand-lg navbar-light bg-light" >

  <div class="container" style="background-color: #06b3ea;">

   <a class="navbar-brand" href="<?= base_url(); ?>">Toekang Ketik</a>

   <button class="navbar-toggler" type="button" data-toggle="collapse"  

data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup"  

aria-expanded="false" aria-label="Toggle navigation">

   <span class="navbar-toggler-icon"></span>

   </button>

   <div class="collapse navbar-collapse" id="navbarNavAltMarkup">

     <div class="navbar-nav">

     <a class="nav-item nav-link"  

href="<?= base_url('mahasiswa'); ?>">Mahasiswa</a>   

     </div>

     </div>

   </div>

</nav> 

footer.php

<!-- Optional JavaScript -->

<!-- jQuery first, then Popper.js, then Bootstrap JS -->

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"  

integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
 crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"  
integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut"  
crossorigin="anonymous"></script>

<script src="<?= base_url(); ?>assets/js/bootstrap.js"></script>

</body>

</html>

Setelah menambahkan file hedaer dan footer didalam folder templates, selanjutnya kita tambahkan 4 file didalam folder mahasiswa yaitu : index.php, tambah.php, edit.php dan detail.php :

index.php

<div class="container">

    <?php if( $this->session->flashdata('msg') ) : ?>

      <div class="row mt-3">

        <div class="col-md-6">

          <div class="alert alert-success alert-dismissible fade show"  
role="alert">

            Data <strong>berhasil</strong> <?= $this->session->flashdata('msg'); ?>

            <button type="button" class="close" data-dismiss="alert"  
aria-label="Close">

              <span aria-hidden="true">&times;</span>

            </button>

          </div>

        </div>

      </div>

    <?php endif; ?>

<div class="row">

<div class="col-md-12">

          <a href="<?= base_url(); ?>mahasiswa/tambah"  
class="btn btn-primary"> Tambah Mahasiswa</a>

          <h1>Data Mahasiswa</h1>

          <table class="table table-stripped">

            <thead>

              <tr>

                <th scope="col">Nama</th>

                <th scope="col" width="200px">Action</th>

              </tr>

            </thead>

            <tbody>

              <?php foreach ($mhs as $mhs) :?>

                <tr>

                  <td><?= $mhs['nama'];?></td>

                  <td>

                    <a href="<?= base_url(); ?>mahasiswa/detail/<?= $mhs['id']; ?>"  
class="badge badge-primary badge-pill">Detail</a>

                    <a href="<?= base_url(); ?>mahasiswa/edit/<?= $mhs['id']; ?>" 
 class="badge badge-primary badge-pill tampilModalUbah">Edit</a>

                    <a href="<?= base_url(); ?>mahasiswa/hapus/<?= $mhs['id']; ?>" 
  class="badge badge-danger badge-pill"  
onclick="return confirm('Hapus data?');">Hapus</a>

                  </td>

                </tr>

              <?php endforeach; ?>

            </tbody>

          </table>    

</div>

</div>

</div>

tambah.php

<div class="container">

<div class="row mt-3">

<div class="col-md-6">

<div class="card">

<div class="card-header">

Form Tambah Data Mahasiswa

</div>

<div class="card-body">

<?php if( validation_errors() ) : ?>

<div class="alert alert-danger" role="alert">

<?= validation_errors(); ?>

</div>

<?php endif; ?>

<form action="" method="post">

<input type="hidden" name="id" id="id">

<div class="form-group">

<label for="nim">Nim</label>

<input type="text" name="nim" id="nim" 
 class="form-control" placeholder="Masukkan nim">

</div>

<div class="form-group">

<label for="nama">Nama</label>

<input type="text" name="nama" id="nama"  
class="form-control" placeholder="Masukkan nama">

</div>

<div class="form-group">

<label for="jurusan">Jurusan</label>

<select name="jurusan" id="jurusan" 
  class="form-control" required="true">

<option>-- Pilih Jurusan--</option>

<option value="Teknik Informatika">Teknik Informatika</option>

<option value="Teknik Elektro">Teknik Elektro</option>

<option value="Teknik Mesin">Teknik Mesin</option>

<option value="Teknik Industri">Teknik Industri</option>

</select>

</div>

<button type="submit" 
  class="btn btn-primary float-right">Tambah Data</button>

<a href="<?= base_url(); ?>/mahasiswa"  
class="btn btn-primary float-right mr-2">Kembali</a>

</form>

</div>

</div>

</div>

</div>

</div>

edit.php

<div class="container">

<div class="row mt-3">

<div class="col-md-6">

<div class="card">

<div class="card-header">

Form Edit Data Mahasiswa

</div>

<div class="card-body">

<?php if( validation_errors() ) : ?>

<div class="alert alert-danger" role="alert">

<?= validation_errors(); ?>

</div>

<?php endif; ?>

<form action="" method="post">

<input type="hidden" name="id" id="id" 
 value="<?= $mhs->id; ?>">

<div class="form-group">

<label for="nim">Nim</label>

<input type="text" name="nim" id="nim" 
 value="<?= $mhs->nim; ?>" class="form-control" placeholder="Masukkan nim">

</div>

<div class="form-group">

<label for="nama">Nama</label>

<input type="text" name="nama" id="nama"  
value="<?= $mhs->nama; ?>" class="form-control" placeholder="Masukkan nama">

</div>

<div class="form-group">

<label for="jurusan">Jurusan</label>

<select name="jurusan" id="jurusan" class="form-control" required="true">

<option value="<?= $mhs->jurusan; ?>"><?= $mhs->jurusan; ?></option>

<option value="Teknik Informatika">Teknik Informatika</option>

<option value="Teknik Elektro">Teknik Elektro</option>

<option value="Teknik Mesin">Teknik Mesin</option>

<option value="Teknik Industri">Teknik Industri</option>

</select>

</div>

<button type="submit" class="btn btn-primary float-right">Ubah Data</button>

<a href="<?= base_url(); ?>/mahasiswa" class="btn btn-primary float-right mr-2">Kembali</a>

</form>

</div>

</div>

</div>

</div>

</div>

detail.php 

<div class="container">

<div class="row mt-3">

<div class="col-md-6">

<div class="card">

<div class="card-header">

Detail Data Mahasiswa

</div>

<div class="card-body">

<?php if( validation_errors() ) : ?>

<div class="alert alert-danger" role="alert">

<?= validation_errors(); ?>

</div>

<?php endif; ?>

<form action="" method="post">

<input type="hidden" name="id" id="id"  
value="<?= $mhs->id; ?>">

<div class="form-group">

<label for="nim">Nim</label>

<input type="text" name="nim" id="nim"  
value="<?= $mhs->nim; ?>" class="form-control" readonly="true">

</div>

<div class="form-group">

<label for="nama">Nama</label>

<input type="text" name="nama" id="nama"  
value="<?= $mhs->nama; ?>" class="form-control" readonly="true">

</div>

<div class="form-group">

<label for="jurusan">Jurusan</label>

<input type="text" name="jurusan" id="jurusan" value="<?= $mhs->jurusan; ?>" class="form-control" readonly="true">

</div>

<a href="<?= base_url(); ?>/mahasiswa" class="btn btn-primary float-right mr-2">Kembali</a>

</form>

</div>

</div>

</div>

</div>

</div>

Selanjutnya kita tambahkan controller dengan nama Mahasiswa didalam folder controller :

Mahasiswa.php

<?php

class Mahasiswa extends CI_Controller{

public function __construct(){

parent::__construct();

$this->load->model('Mahasiswa_model');

$this->load->library('form_validation');

}

public function index(){

$data['title'] = 'Halaman Mahasiswa';

$data['mhs'] = $this->Mahasiswa_model->getAllMahasiswa();

$this->load->view('templates/header', $data);

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

$this->load->view('templates/footer');

}

public function tambah(){

$data['title'] = 'Tambah Mahasiswa';

$this->form_validation->set_rules('nim', 'Nim', 'required|numeric');

$this->form_validation->set_rules('nama', 'Nama', 'required');

if( $this->form_validation->run() == FALSE ){

$this->load->view('templates/header', $data);

$this->load->view('mahasiswa/tambah');

$this->load->view('templates/footer');

}else{

$this->Mahasiswa_model->tambahMahasiswa();

$this->session->set_flashdata('msg', 'Ditambahkan');

redirect('mahasiswa');

}

}

public function edit($id){

$data['title'] = 'Edit Data Mahasiswa';

$data['mhs'] = $this->Mahasiswa_model->getAllMahasiswaById($id);

$this->form_validation->set_rules('nim', 'Nim', 'required|numeric');

$this->form_validation->set_rules('nama', 'Nama', 'required');

if( $this->form_validation->run() == FALSE ){

$this->load->view('templates/header', $data);

$this->load->view('mahasiswa/edit', $data);

$this->load->view('templates/footer');

} else{

$this->Mahasiswa_model->editMahasiswa();

$this->session->set_flashdata('msg', 'Diubah');

redirect('mahasiswa');

}

}

public function detail($id){

$data['title'] = 'Detail Data Mahasiswa';

$data['mhs'] = $this->Mahasiswa_model->getAllMahasiswaById($id);

$this->load->view('templates/header', $data);

$this->load->view('mahasiswa/detail', $data);

$this->load->view('templates/footer');

}

public function hapus($id){

$this->Mahasiswa_model->hapusMahasiswa($id);

$this->session->set_flashdata('msg', 'Dihapus');

redirect('mahasiswa');

}

}

dan kita tambahkan model -> Mahasiswa_model.php didalam folder models :

Mahasiswa_model.php

<?php

class Mahasiswa_model extends CI_model{

public function getAllMahasiswa(){

return $this->db->get('mahasiswa')->result_array();

}

public function getAllMahasiswaById($id){

$options=array('id'=>$id);

$query = $this->db->get_where('mahasiswa',$options);

$ret = $query->row();

return $ret;

}

public function tambahMahasiswa(){

$mhsdata = [

'nim' => $this->input->post('nim', true),

'nama' => $this->input->post('nama', true),

'jurusan' => $this->input->post('jurusan')

];

$this->db->insert('mahasiswa', $mhsdata);

}

public function editMahasiswa(){

$mhsdata = [

'id' => $this->input->post('id', true),

'nim' => $this->input->post('nim', true),

'nama' => $this->input->post('nama', true),

'jurusan' => $this->input->post('jurusan')

];

$this->db->where('id', $this->input->post('id', true));

$this->db->update('mahasiswa', $mhsdata);

}

public function hapusMahasiswa($id){

$this->db->where('id', $id);

$this->db->delete('mahasiswa');

}

}

lalu kita rubah default view agar ketika kita pertama kali menjalankan localhost/ci-app langsung mengarah ke view mahasiswa kita masuk ke folder config dan buka file routes.php dan rubah seperti berikut :

selanjutnya kita buka file autoload.php dan rubah seperti berikut : 

<?php

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

/*

| -------------------------------------------------------------------

| AUTO-LOADER

| -------------------------------------------------------------------

| This file specifies which systems should be loaded by default.

|

| In order to keep the framework as light-weight as possible only the

| absolute minimal resources are loaded by default. For example,

| the database is not connected to automatically since no assumption

| is made regarding whether you intend to use it. This file lets

| you globally define which systems you would like loaded with every

| request.

|

| -------------------------------------------------------------------

| Instructions

| -------------------------------------------------------------------

|

| These are the things you can load automatically:

|

| 1. Packages

| 2. Libraries

| 3. Drivers

| 4. Helper files

| 5. Custom config files

| 6. Language files

| 7. Models

|

*/

/*

| -------------------------------------------------------------------

| Auto-load Packages

| -------------------------------------------------------------------

| Prototype:

|

| $autoload['packages'] = array(APPPATH.'third_party', '/usr/local/shared');

|

*/

$autoload['packages'] = array();

/*

| -------------------------------------------------------------------

| Auto-load Libraries

| -------------------------------------------------------------------

| These are the classes located in system/libraries/ or your

| application/libraries/ directory, with the addition of the

| 'database' library, which is somewhat of a special case.

|

| Prototype:

|

|   $autoload['libraries'] = array('database', 'email', 'session');

|

| You can also supply an alternative library name to be assigned

| in the controller:

|

|   $autoload['libraries'] = array('user_agent' => 'ua');

*/

$autoload['libraries'] = array('database', 'session');

/*

| -------------------------------------------------------------------

| Auto-load Drivers

| -------------------------------------------------------------------

| These classes are located in system/libraries/ or in your

| application/libraries/ directory, but are also placed inside their

| own subdirectory and they extend the CI_Driver_Library class. They

| offer multiple interchangeable driver options.

|

| Prototype:

|

|   $autoload['drivers'] = array('cache');

|

| You can also supply an alternative property name to be assigned in

| the controller:

|

|   $autoload['drivers'] = array('cache' => 'cch');

|

*/

$autoload['drivers'] = array();

/*

| -------------------------------------------------------------------

| Auto-load Helper Files

| -------------------------------------------------------------------

| Prototype:

|

|   $autoload['helper'] = array('url', 'file');

*/

$autoload['helper'] = array('url');

/*

| -------------------------------------------------------------------

| Auto-load Config files

| -------------------------------------------------------------------

| Prototype:

|

|   $autoload['config'] = array('config1', 'config2');

|

| NOTE: This item is intended for use ONLY if you have created custom

| config files. Otherwise, leave it blank.

|

*/

$autoload['config'] = array();

/*

| -------------------------------------------------------------------

| Auto-load Language files

| -------------------------------------------------------------------

| Prototype:

|

|   $autoload['language'] = array('lang1', 'lang2');

|

| NOTE: Do not include the "_lang" part of your file. For example

| "codeigniter_lang.php" would be referenced as array('codeigniter');

|

*/

$autoload['language'] = array();

/*

| -------------------------------------------------------------------

| Auto-load Models

| -------------------------------------------------------------------

| Prototype:

|

|   $autoload['model'] = array('first_model', 'second_model');

|

| You can also supply an alternative model name to be assigned

| in the controller:

|

|   $autoload['model'] = array('first_model' => 'first');

*/

$autoload['model'] = array();

tambahkan file .htaccess didalam folder ci-app

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]

dan file config.php dibagian base_url rubah seperti berikut :

 

sekarang silahkan dijalankan kembali aplikasinya jika berhasil akan muncul seperti berikut :

 


tambah mahasiswa








edit mahasiswa





detail mahasiswa



hapus mahasiswa 

 






Cukup sekian sharing kali ini, semoga bermanfaat :D