Konfigurasi Fitur CRUD Pada Codeigniter
Langkah-langkah untuk membuat fitur CRUD pada Codeigniter adalah sebagai berikut :
1. Membuat Database
Buat tabel-tabel dibawah ini untuk database barang. Kode SQL yang diinput seperti berikut :
1 2 3 4 5 6 7 | CREATE TABLE `products` ( `product_id` varchar(64) NOT NULL, `name` varchar(255) NOT NULL, `price` int(11) NOT NULL, `image` varchar(255) NOT NULL DEFAULT 'default.jpg', `description` text NOT NULL ) ENGINE=InnoDB DEFAULT CHARSET=latin1; |
Tabel di phpmyadmin akan berisi seperti berikut :
2. Konfigurasi Codeigniter
Buka config/database.php dan isi kode seperti berikut :
Lalu, buka config/autoload.php dan isi array dengan ini :
Buka config/database.php dan isi kode seperti berikut :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | $db['default'] = array( 'dsn' => '', 'hostname' => 'localhost', 'username' => 'root', 'password' => '', 'database' => 'pbkkos', '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 ); |
Lalu, buka config/autoload.php dan isi array dengan ini :
$autoload['libraries'] = array('database', 'session'); |
3. Membuat Model untuk Tabel
Buat file baru bernama Product_model,php di dalam application/model agar dapat mengambil maupun melakukan update data dari database. Kode di dalam file ini berisi seperti berikut :
4. Membuat Controller
Buat file Products.php di dalam application/controllers/admin dan isi seperti berikut :
Fungsi controller adalah untuk memanggil method-method yang ada di dalam mdoel untuk mendapatkan data dan di-render ke dalam view.
5. Membuat View
View adalah bagian yang bertugas untuj mengurus tampilan. Hal pertama yang harus dilakukan adalah membuat direktori baru bernama product di dalam views/admin. Lalu kita membuat beberapa file untuk tampilan. Beberapa file berikut adalah :
list.php
new_form.php
edit_form.php
6. Membuat Fitur Hapus Data
Buka file views/admin/product/list.php, lalu tambahkan kode berikut sebelum penutup <body>.
Setelah itu, tambahkan modal untuk delete di dalam file views/admin/_partials/modal.php.
7. Percobaan Aplikasi
Menambahkan data baru :
Melihat list produk :
Mengedit data baru :
Menghapus data baru :
Untuk source code dapat dilihat di-link berikut :
Source Code
Buat file baru bernama Product_model,php di dalam application/model agar dapat mengambil maupun melakukan update data dari database. Kode di dalam file ini berisi seperti berikut :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 | <?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->image = $this->_uploadImage(); $this->description = $post["description"]; return $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"]; if (!empty($_FILES["image"]["name"])) { $this->image = $this->_uploadImage(); } else { $this->image = $post["old_image"]; } $this->description = $post["description"]; return $this->db->update($this->_table, $this, array('product_id' => $post['id'])); } public function delete($id) { $this->_deleteImage($id); return $this->db->delete($this->_table, array("product_id" => $id)); } 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"; } 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.*")); } } } |
4. Membuat Controller
Buat file Products.php di dalam application/controllers/admin dan isi seperti berikut :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 | <?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')); } } } |
Fungsi controller adalah untuk memanggil method-method yang ada di dalam mdoel untuk mendapatkan data dan di-render ke dalam view.
5. Membuat View
View adalah bagian yang bertugas untuj mengurus tampilan. Hal pertama yang harus dilakukan adalah membuat direktori baru bernama product di dalam views/admin. Lalu kita membuat beberapa file untuk tampilan. Beberapa file berikut adalah :
list.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 | <!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> |
new_form.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 | <!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 echo site_url('admin/products/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> |
edit_form.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 | <!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="" method="post" enctype="multipart/form-data"> <!-- Note: atribut action dikosongkan, artinya action-nya akan diproses oleh controller tempat vuew ini digunakan. Yakni index.php/admin/products/edit/ID ---> <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> |
6. Membuat Fitur Hapus Data
Buka file views/admin/product/list.php, lalu tambahkan kode berikut sebelum penutup <body>.
<script> function deleteConfirm(url){ $('#btn-delete').attr('href', url); $('#deleteModal').modal(); } </script>
Setelah itu, tambahkan modal untuk delete di dalam 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>
7. Percobaan Aplikasi
Menambahkan data baru :
Melihat list produk :
Mengedit data baru :
Menghapus data baru :
Untuk source code dapat dilihat di-link berikut :
Source Code
Comments
Post a Comment