Tugas PWeb - Membuat CRUD dengan CodeIgniter

Nama: Donny Fitrado
NRP: 05111740000171
Kelas: PWeb C

Di tugas kali ini, saya akan mengimplementasikan CRUD tambah produk dan fitur upload dengan CodeIgniter beserta database.

Langkah-langkahnya:
  • Membuat database terlebih dahulu untuk domain tokobuah
  • Pada folder /application/config/database.php, tambahkan kode seperti berikut untuk menghubungkan domain dengan database yang telah kita buat
 <?php  
 defined('BASEPATH') OR exit('No direct script access allowed');  
 $active_group = 'default';  
 $query_builder = TRUE;  
 $db['default'] = array(  
      'dsn'     => '',  
      'hostname' => 'localhost',  
      'username' => 'root',  
      'password' => '',  
      'database' => 'tokobuah',  
      'dbdriver' => 'mysqli',  
      'dbprefix' => '',  
      'pconnect' => FALSE,  
      'db_debug' => (ENVIRONMENT !== 'production'),  
      'cache_on' => FALSE,  
      'cachedir' => '',  
      'char_set' => 'utf8',  
      'dbcollat' => 'utf8_general_ci',  
      'swap_pre' => '',  
      'encrypt' => FALSE,  
      'compress' => FALSE,  
      'stricton' => FALSE,  
      'failover' => array(),  
      'save_queries' => TRUE  
 );  


  • Pada bagian 'hostname','username','password','database' disesuaikan dengan database yang telah dibuat sebelumnya.
Saya menggunakan mySQL:
 'hostname' => 'localhost',  
      'username' => 'root',  
      'password' => '',  
      'database' => 'tokobuah',  
  • Pada /aplication/config/autoload.php, tambahkan database dan sesion pada variabel autoload. Sehingga autoload.php akan terlihat seperti ini:
 <?php  
 defined('BASEPATH') OR exit('No direct script access allowed');  
 $autoload['packages'] = array();  
 $autoload['libraries'] = array('database', 'session');  
 $autoload['drivers'] = array();  
 $autoload['helper'] = array('url');  
 $autoload['config'] = array();  
 $autoload['language'] = array();  
 $autoload['model'] = array();  

  • Pada /aplication/model/ , tambahkan file baru bernama Product_model.php dan tambahkan kode berikut.
 <?php defined('BASEPATH') OR exit('No direct script access allowed');  
 class Product_model extends CI_Model  
 {  
   private $_table = "products";  
   public $product_id;  
   public $name;  
   public $price;  
   public $image = "default.jpg";  
   public $description;  
   public function rules()  
   {  
     return [  
       ['field' => 'name',  
       'label' => 'Name',  
       'rules' => 'required'],  
       ['field' => 'price',  
       'label' => 'Price',  
       'rules' => 'numeric'],  
       ['field' => 'description',  
       'label' => 'Description',  
       'rules' => 'required']  
     ];  
   }  
   public function getAll()  
   {  
     return $this->db->get($this->_table)->result();  
   }  
   public function getById($id)  
   {  
     return $this->db->get_where($this->_table, ["product_id" => $id])->row();  
   }  
   public function save()  
   {  
     $post = $this->input->post();  
     $this->product_id = uniqid();  
     $this->name = $post["name"];  
     $this->price = $post["price"];  
     $this->description = $post["description"];  
     $this->db->insert($this->_table, $this);  
   }  
   public function update()  
   {  
     $post = $this->input->post();  
     $this->product_id = $post["id"];  
     $this->name = $post["name"];  
     $this->price = $post["price"];  
     $this->description = $post["description"];  
     $this->db->update($this->_table, $this, array('product_id' => $post['id']));  
   }  
   public function delete($id)  
   {  
     return $this->db->delete($this->_table, array("product_id" => $id));  
   }  
 }  

  • Untuk membuat controller, maka dapat membuat file baru di folder /application/controllers/admin/ dengan nama Products.php
 <?php  
 defined('BASEPATH') OR exit('No direct script access allowed');  
 class Products extends CI_Controller  
 {  
   public function __construct()  
   {  
     parent::__construct();  
     $this->load->model("product_model");  
     $this->load->library('form_validation');  
   }  
   public function index()  
   {  
     $data["products"] = $this->product_model->getAll();  
     $this->load->view("admin/product/list", $data);  
   }  
   public function add()  
   {  
     $product = $this->product_model;  
     $validation = $this->form_validation;  
     $validation->set_rules($product->rules());  
     if ($validation->run()) {  
       $product->save();  
       $this->session->set_flashdata('success', 'Berhasil disimpan');  
     }  
     $this->load->view("admin/product/new_form");  
   }  
   public function edit($id = null)  
   {  
     if (!isset($id)) redirect('admin/products');  
     $product = $this->product_model;  
     $validation = $this->form_validation;  
     $validation->set_rules($product->rules());  
     if ($validation->run()) {  
       $product->update();  
       $this->session->set_flashdata('success', 'Berhasil disimpan');  
     }  
     $data["product"] = $product->getById($id);  
     if (!$data["product"]) show_404();  
     $this->load->view("admin/product/edit_form", $data);  
   }  
   public function delete($id=null)  
   {  
     if (!isset($id)) show_404();  
     if ($this->product_model->delete($id)) {  
       redirect(site_url('admin/products'));  
     }  
   }  
 }  


  • Untuk membuat bagian view, maka kita dapat membuat sebuah folder baru pada /views/admin/ dengan nama product. 
  • Kemudian, kita membuat fire baru dengan nama list.php di /views/admin/product/ dan masukkan kode berikut.
 <!DOCTYPE html>  
 <html lang="en">  
 <head>  
      <?php $this->load->view("admin/_partials/head.php") ?>  
 </head>  
 <body id="page-top">  
      <?php $this->load->view("admin/_partials/navbar.php") ?>  
      <div id="wrapper">  
           <?php $this->load->view("admin/_partials/sidebar.php") ?>  
           <div id="content-wrapper">  
                <div class="container-fluid">  
                     <?php $this->load->view("admin/_partials/breadcrumb.php") ?>  
                     <!-- DataTables -->  
                     <div class="card mb-3">  
                          <div class="card-header">  
                               <a href="<?php echo site_url('admin/products/add') ?>"><i class="fas fa-plus"></i> Add New</a>  
                          </div>  
                          <div class="card-body">  
                               <div class="table-responsive">  
                                    <table class="table table-hover" id="dataTable" width="100%" cellspacing="0">  
                                         <thead>  
                                              <tr>  
                                                   <th>Name</th>  
                                                   <th>Price</th>  
                                                   <th>Photo</th>  
                                                   <th>Description</th>  
                                                   <th>Action</th>  
                                              </tr>  
                                         </thead>  
                                         <tbody>  
                                              <?php foreach ($products as $product): ?>  
                                              <tr>  
                                                   <td width="150">  
                                                        <?php echo $product->name ?>  
                                                   </td>  
                                                   <td>  
                                                        <?php echo $product->price ?>  
                                                   </td>  
                                                   <td>  
                                                        <img src="<?php echo base_url('upload/product/'.$product->image) ?>" width="64" />  
                                                   </td>  
                                                   <td class="small">  
                                                        <?php echo substr($product->description, 0, 120) ?>...</td>  
                                                   <td width="250">  
                                                        <a href="<?php echo site_url('admin/products/edit/'.$product->product_id) ?>"  
                                                         class="btn btn-small"><i class="fas fa-edit"></i> Edit</a>  
                                                        <a onclick="deleteConfirm('<?php echo site_url('admin/products/delete/'.$product->product_id) ?>')"  
                                                         href="#!" class="btn btn-small text-danger"><i class="fas fa-trash"></i> Hapus</a>  
                                                   </td>  
                                              </tr>  
                                              <?php endforeach; ?>  
                                         </tbody>  
                                    </table>  
                               </div>  
                          </div>  
                     </div>  
                </div>  
                <!-- /.container-fluid -->  
                <!-- Sticky Footer -->  
                <?php $this->load->view("admin/_partials/footer.php") ?>  
           </div>  
           <!-- /.content-wrapper -->  
      </div>  
      <!-- /#wrapper -->  
      <?php $this->load->view("admin/_partials/scrolltop.php") ?>  
      <?php $this->load->view("admin/_partials/modal.php") ?>  
      <?php $this->load->view("admin/_partials/js.php") ?>  
    
 </body>  
 </html
  • Lalu untuk membuat form add, maka kita dapat membuat file baru dengan nama new_form.php pada /view/admin/product dan masukkan kode berikut:

 <!DOCTYPE html>  
 <html lang="en">  
 <head>  
      <?php $this->load->view("admin/_partials/head.php") ?>  
 </head>  
 <body id="page-top">  
      <?php $this->load->view("admin/_partials/navbar.php") ?>  
      <div id="wrapper">  
           <?php $this->load->view("admin/_partials/sidebar.php") ?>  
           <div id="content-wrapper">  
                <div class="container-fluid">  
                     <?php $this->load->view("admin/_partials/breadcrumb.php") ?>  
                     <?php if ($this->session->flashdata('success')): ?>  
                     <div class="alert alert-success" role="alert">  
                          <?php echo $this->session->flashdata('success'); ?>  
                     </div>  
                     <?php endif; ?>  
                     <div class="card mb-3">  
                          <div class="card-header">  
                               <a href="<?php echo site_url('admin/products/') ?>"><i class="fas fa-arrow-left"></i> Back</a>  
                          </div>  
                          <div class="card-body">  
                               <form action="<?php base_url('admin/product/add') ?>" method="post" enctype="multipart/form-data" >  
                                    <div class="form-group">  
                                         <label for="name">Name*</label>  
                                         <input class="form-control <?php echo form_error('name') ? 'is-invalid':'' ?>"  
                                          type="text" name="name" placeholder="Product name" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('name') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="price">Price*</label>  
                                         <input class="form-control <?php echo form_error('price') ? 'is-invalid':'' ?>"  
                                          type="number" name="price" min="0" placeholder="Product price" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('price') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="name">Photo</label>  
                                         <input class="form-control-file <?php echo form_error('price') ? 'is-invalid':'' ?>"  
                                          type="file" name="image" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('image') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="name">Description*</label>  
                                         <textarea class="form-control <?php echo form_error('description') ? 'is-invalid':'' ?>"  
                                          name="description" placeholder="Product description..."></textarea>  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('description') ?>  
                                         </div>  
                                    </div>  
                                    <input class="btn btn-success" type="submit" name="btn" value="Save" />  
                               </form>  
                          </div>  
                          <div class="card-footer small text-muted">  
                               * required fields  
                          </div>  
                     </div>  
                     <!-- /.container-fluid -->  
                     <!-- Sticky Footer -->  
                     <?php $this->load->view("admin/_partials/footer.php") ?>  
                </div>  
                <!-- /.content-wrapper -->  
           </div>  
           <!-- /#wrapper -->  
           <?php $this->load->view("admin/_partials/scrolltop.php") ?>  
           <?php $this->load->view("admin/_partials/js.php") ?>  
 </body>  
 </html>  


  • Untuk menambahkan fitur edit, maka dapat dibuat file baru bernama edit_form.php pada folder /views/admin/product/ dan masukkan kode berikut:
 <!DOCTYPE html>  
 <html lang="en">  
 <head>  
      <?php $this->load->view("admin/_partials/head.php") ?>  
 </head>  
 <body id="page-top">  
      <?php $this->load->view("admin/_partials/navbar.php") ?>  
      <div id="wrapper">  
           <?php $this->load->view("admin/_partials/sidebar.php") ?>  
           <div id="content-wrapper">  
                <div class="container-fluid">  
                     <?php $this->load->view("admin/_partials/breadcrumb.php") ?>  
                     <?php if ($this->session->flashdata('success')): ?>  
                     <div class="alert alert-success" role="alert">  
                          <?php echo $this->session->flashdata('success'); ?>  
                     </div>  
                     <?php endif; ?>  
                     <!-- Card -->  
                     <div class="card mb-3">  
                          <div class="card-header">  
                               <a href="<?php echo site_url('admin/products/') ?>"><i class="fas fa-arrow-left"></i>  
                                    Back</a>  
                          </div>  
                          <div class="card-body">  
                               <form action="<?php base_url('admin/product/edit') ?>" method="post" enctype="multipart/form-data">  
                                    <input type="hidden" name="id" value="<?php echo $product->product_id?>" />  
                                    <div class="form-group">  
                                         <label for="name">Name*</label>  
                                         <input class="form-control <?php echo form_error('name') ? 'is-invalid':'' ?>"  
                                          type="text" name="name" placeholder="Product name" value="<?php echo $product->name ?>" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('name') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="price">Price</label>  
                                         <input class="form-control <?php echo form_error('price') ? 'is-invalid':'' ?>"  
                                          type="number" name="price" min="0" placeholder="Product price" value="<?php echo $product->price ?>" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('price') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="name">Photo</label>  
                                         <input class="form-control-file <?php echo form_error('image') ? 'is-invalid':'' ?>"  
                                          type="file" name="image" />  
                                         <input type="hidden" name="old_image" value="<?php echo $product->image ?>" />  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('image') ?>  
                                         </div>  
                                    </div>  
                                    <div class="form-group">  
                                         <label for="name">Description*</label>  
                                         <textarea class="form-control <?php echo form_error('description') ? 'is-invalid':'' ?>"  
                                          name="description" placeholder="Product description..."><?php echo $product->description ?></textarea>  
                                         <div class="invalid-feedback">  
                                              <?php echo form_error('description') ?>  
                                         </div>  
                                    </div>  
                                    <input class="btn btn-success" type="submit" name="btn" value="Save" />  
                               </form>  
                          </div>  
                          <div class="card-footer small text-muted">  
                               * required fields  
                          </div>  
                     </div>  
                     <!-- /.container-fluid -->  
                     <!-- Sticky Footer -->  
                     <?php $this->load->view("admin/_partials/footer.php") ?>  
                </div>  
                <!-- /.content-wrapper -->  
           </div>  
           <!-- /#wrapper -->  
           <?php $this->load->view("admin/_partials/scrolltop.php") ?>  
           <?php $this->load->view("admin/_partials/js.php") ?>  
 </body>  
 </html>  


  • Untuk menambahkan fitur konfirmasi ketika suatu data akan dihapus, maka dapat menambahkan kode berikut pada file list.php pada /views/admin/product/list.php 
  • Tambahkan kode berikut sebelum penutup tag body:
 <script>  
      function deleteConfirm(url){  
           $('#btn-delete').attr('href', url);  
           $('#deleteModal').modal();  
      }  
 </script>  

  • Sehingga, list.php akan terlihat seperti ini:
 <!DOCTYPE html>  
 <html lang="en">  
 <head>  
      <?php $this->load->view("admin/_partials/head.php") ?>  
 </head>  
 <body id="page-top">  
      <?php $this->load->view("admin/_partials/navbar.php") ?>  
      <div id="wrapper">  
           <?php $this->load->view("admin/_partials/sidebar.php") ?>  
           <div id="content-wrapper">  
                <div class="container-fluid">  
                     <?php $this->load->view("admin/_partials/breadcrumb.php") ?>  
                     <!-- DataTables -->  
                     <div class="card mb-3">  
                          <div class="card-header">  
                               <a href="<?php echo site_url('admin/products/add') ?>"><i class="fas fa-plus"></i> Add New</a>  
                          </div>  
                          <div class="card-body">  
                               <div class="table-responsive">  
                                    <table class="table table-hover" id="dataTable" width="100%" cellspacing="0">  
                                         <thead>  
                                              <tr>  
                                                   <th>Name</th>  
                                                   <th>Price</th>  
                                                   <th>Photo</th>  
                                                   <th>Description</th>  
                                                   <th>Action</th>  
                                              </tr>  
                                         </thead>  
                                         <tbody>  
                                              <?php foreach ($products as $product): ?>  
                                              <tr>  
                                                   <td width="150">  
                                                        <?php echo $product->name ?>  
                                                   </td>  
                                                   <td>  
                                                        <?php echo $product->price ?>  
                                                   </td>  
                                                   <td>  
                                                        <img src="<?php echo base_url('upload/product/'.$product->image) ?>" width="64" />  
                                                   </td>  
                                                   <td class="small">  
                                                        <?php echo substr($product->description, 0, 120) ?>...</td>  
                                                   <td width="250">  
                                                        <a href="<?php echo site_url('admin/products/edit/'.$product->product_id) ?>"  
                                                         class="btn btn-small"><i class="fas fa-edit"></i> Edit</a>  
                                                        <a onclick="deleteConfirm('<?php echo site_url('admin/products/delete/'.$product->product_id) ?>')"  
                                                         href="#!" class="btn btn-small text-danger"><i class="fas fa-trash"></i> Hapus</a>  
                                                   </td>  
                                              </tr>  
                                              <?php endforeach; ?>  
                                         </tbody>  
                                    </table>  
                               </div>  
                          </div>  
                     </div>  
                </div>  
                <!-- /.container-fluid -->  
                <!-- Sticky Footer -->  
                <?php $this->load->view("admin/_partials/footer.php") ?>  
           </div>  
           <!-- /.content-wrapper -->  
      </div>  
      <!-- /#wrapper -->  
      <?php $this->load->view("admin/_partials/scrolltop.php") ?>  
      <?php $this->load->view("admin/_partials/modal.php") ?>  
      <?php $this->load->view("admin/_partials/js.php") ?>  
           <script>  
      function deleteConfirm(url){  
           $('#btn-delete').attr('href', url);  
           $('#deleteModal').modal();  
      }  
 </script>  
 </body>  
 </html>  


  • Kemudian, tambahkan sebuah modal untuk men-delete di file /views/admin/_partials/modal.php
 <!-- Logout Delete Confirmation-->  
 <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">  
  <div class="modal-dialog" role="document">  
   <div class="modal-content">  
    <div class="modal-header">  
     <h5 class="modal-title" id="exampleModalLabel">Are you sure?</h5>  
     <button class="close" type="button" data-dismiss="modal" aria-label="Close">  
      <span aria-hidden="true">×</span>  
     </button>  
    </div>  
    <div class="modal-body">Data yang dihapus tidak akan bisa dikembalikan.</div>  
    <div class="modal-footer">  
     <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>  
     <a id="btn-delete" class="btn btn-danger" href="#">Delete</a>  
    </div>  
   </div>  
  </div>  
 </div>  

  • Untuk menambahkan fitur upload, maka dapat membuat folder baru bernama upload dalam project, dan di dalamnya membuat folder lagi bernama product. Kita juga menaruh file default.jpg
  • Lalu, buka file Product_model.php lalu tambahkan method_uploadImage() setelah fungsi delete
  private function _uploadImage()    
   {    
   $config['upload_path']  = './upload/product/';    
   $config['allowed_types'] = 'gif|jpg|png';    
   $config['file_name']  = $this->product_id;    
   $config['overwrite']  = true;    
   $config['max_size']  = 1024; // 1MB    
   // $config['max_width']  = 1024;    
   // $config['max_height']  = 768;    
   $this->load->library('upload', $config);    
   if ($this->upload->do_upload('image')) {    
   return $this->upload->data("file_name");    
   }    
   return "default.jpg";    
   }   


  • Kemudian, mengubah method save() dan update() menjadi seperti berikut:
    • save():
  public function save()    
   {    
   $post = $this->input->post();    
   $this->product_id = uniqid();    
   $this->name = $post["name"];    
   $this->price = $post["price"];    
   $this->image = $this->_uploadImage();    
   $this->description = $post["description"];    
   $this->db->insert($this->_table, $this);    
   }   
    • update():
 public function update()    
   {    
   $post = $this->input->post();    
   $this->product_id = $post["id"];    
   $this->name = $post["name"];    
   $this->price = $post["price"];    
   if (!empty($_FILES["image"]["name"])) {    
    $this->image = $this->_uploadImage();    
   } else {    
    $this->image = $post["old_image"];    
   }    
   $this->description = $post["description"];    
   $this->db->update($this->_table, $this, array('product_id' => $post['id']));    
   }    
  • Untuk menghapus file yang telah diupload, maka kita memerlukan method khusus. Oleh karena itu, kita dapat menambahkan method berikut ini dalam class Product_model , tepat di bawah method _uploadImage():
  private function _deleteImage($id)    
   {    
   $product = $this->getById($id);    
   if ($product->image != "default.jpg") {    
    $filename = explode(".", $product->image)[0];    
    return array_map('unlink', glob(FCPATH."upload/product/$filename.*"));    
   }    
   }    


Screenshot:
1. Tampilan Utama

2. Tidak ada product dalam list products

3. Menambahkan product

4. Produk Buah Naga telah ditambahkan

5. Mengedit description produk buah naga

 6. Description produk buah naga telah diedit

7. Himbauan ketika produk ingin dihapus

Terima kasih, dan mohon maaf apabila ada kesalahan.

Comments

Popular posts from this blog

Tugas 2 - Pemrograman Orientasi Objek

Tugas 5 PBKK A

Tugas PBO - Tech Support