Riedayme
Riedayme

Membuat Crud CodeIgniter 3

Tutorial CodeIgniter Kali ini akan membuat proses Create, Read, Update, Delete atau bisa disingkat CRUD, disini saya akan membuatnya menggunakan codeigniter 3.

1. Membuat Database

masuk kedalam database daily_codeigniter kemudian masukan query sql dibawah ini untuk membuat tablenya :
CREATE TABLE `tb_biodata` (
  `id` int(255) NOT NULL,
  `name` varchar(255) NOT NULL,
  `gender` enum('Male','Female') NOT NULL,
  `birthday` date NOT NULL,
  `photo` varchar(255) NOT NULL,
  `hobby` varchar(255) NOT NULL,
  `about` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

--
-- Indexes for dumped tables
--

--
-- Indexes for table `tb_biodata`
--
ALTER TABLE `tb_biodata`
  ADD PRIMARY KEY (`id`);

--
-- AUTO_INCREMENT for table `tb_biodata`
--
ALTER TABLE `tb_biodata`
  MODIFY `id` int(255) NOT NULL AUTO_INCREMENT;

2. Membuat Controller

  • buat file controllers dengan nama Crud.php didalam folder app maka pathnya adalah application/controllers/app/Crud.php
  • kemudian isi dengan kode dibawah ini :
<?php  
defined('BASEPATH') OR exit('no direct script access allowed');

class Crud extends MY_App
{

    private $redirect = 'app/crud';

    public function __construct()
    {

        parent::__construct();

        $this->load->helper('form');
        $this->load->library('form_validation');
        $this->load->model('app/M_Crud');
    }

    public function index()
    {

        $data = [
        'title' => 'Module Crud',
        'biodata' => $this->M_Crud->read(),
        ];

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

    public function create()
    {

        $data = [
        'title' => 'Create Data',
        'update' => false,
        ];

        $this->load->view('app/crud/form',$data); 
    }

    public function process_create()
    {

        $create = $this->M_Crud->create();

        if ($create == TRUE) {

            $this->session->set_flashdata('create', true);
        }
        else {

            $this->session->set_flashdata('create', 'failed');
        }    

        redirect($this->redirect);
    }

    public function update($id)
    {

        $data = [
        'title' => 'Update Data',
        'update' => true,
        'biodata' => $this->M_Crud->read_by($id),
        ];

        $this->load->view('app/crud/form',$data);
    }

    public function process_update($id)
    {

        if ($this->M_Crud->update($id) == TRUE) {

            $this->session->set_flashdata('edit', true);
        }else {

            $this->session->set_flashdata('edit', 'failed');
        }     

        redirect($this->redirect);   
    }

    public function process_delete($id)
    {


        if ($this->M_Crud->delete($id) == TRUE) {

            $this->session->set_flashdata('delete', true);
        }else {

            $this->session->set_flashdata('delete', 'failed');
        }     

        redirect($this->redirect);
    }
}

?>

3. Membuat Model

  • Dilanjut membuat file model dengan nama M_Crud.php didalam folder app (buat folder app terlebih dahulu) maka pathnya adalah application/models/app/M_Crud.php
  • kemudian isi dengan kode dibawah ini :
<?php  
defined('BASEPATH') OR exit('no direct script access allowed');

class M_Crud extends CI_Model 
{

    private $table = 'tb_biodata';
    private $storage_path = 'storage/uploads/';


    /**
     * Form Process    
     */
    
    public function _form_data($identity = false)
    {

        $this->_form_validation();

        $prepare_data = array(
            'name' => $this->input->post('name'),
            'gender' => $this->input->post('gender'),
            'birthday' => date('Y-m-d', strtotime($this->input->post('birthday'))),
            'hobby' => $this->input->post('hobby'),
            'about' => $this->input->post('about'),
            );

        if (!empty($_FILES['photo']['name'])) 
        {

            if ($identity) 
            {

                $delete_image = $this->db->get_where($this->table,$identity)->row_array();

                $this->__delete_file($delete_image['photo']);
            }

            $upload_image = $this->__upload_file();

            if ($upload_image !== 'failed') 
            {

                $photo = $upload_image;
            }else 
            {

                echo "failed upload photo, code error";
                exit;
            }

            $photo = array('photo' => $photo);
            $data = array_merge($prepare_data,$photo);

        }else 
        {

            $data = $prepare_data;
        }

        return $data;
    } 

    public function _form_validation()
    {
        $this->form_validation->set_rules('name','name','required');
        $this->form_validation->set_rules('gender','gender','required');
        $this->form_validation->set_rules('birthday','birthday','required');        
        $this->form_validation->set_rules('hobby','hobby','required');
        $this->form_validation->set_rules('about','about','required');

        $this->form_validation->set_error_delimiters('<span>', '</span>');

        if($this->form_validation->run() != false)
        {

            return true;
        }else{

            $data = array(
              'name' => form_error('name'),
              'gender' => form_error('gender'),
              'birthday' => form_error('birthday'),
              'hobby' => form_error('hobby'),
              'about' => form_error('about'),
              );

            $this->session->set_flashdata($data);

            redirect($_SERVER['HTTP_REFERER']);
        }
    }


    /**
     * Database Process
     */

    public function read()
    {
        return $this->db->get($this->table)->result_array();
    }

    public function read_by($id)
    {

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

        return $this->db->get_where($this->table,$identity)->row_array();
    }

    public function create()
    {

        $post_data = $this->_form_data();

        $this->db->insert($this->table,$post_data);

        return ($this->db->affected_rows() > 0) ? true : false;

    }

    public function update($id)
    {


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

        $post_data = $this->_form_data($identity);

        $this->db->trans_start();
        $this->db->update($this->table, $post_data, $identity);
        $this->db->trans_complete();

        if ($this->db->affected_rows() > 0) {
            return true;
        }else {
            if ($this->db->trans_status() === false) {
                return false;
            }else {                
                return true;
            }
        }   

    }    

    public function delete($id)
    {

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

        $this->db->db_debug = false;
        $read = $this->db->get_where($this->table,$identity);

        if ($read->num_rows() > 0) {

            $delete_image = $read->row_array();

            $this->__delete_file($delete_image['photo']);

            $this->db->delete($this->table,$identity);        

            return ($this->db->affected_rows() > 0) ? true : false;
        }

    }


    /**
     * File Process
     */

    public function __upload_file()
    {

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

        $config_upload = [
        'upload_path' => $this->storage_path,
        'allowed_types' =>'jpg|png|ico',
        ];

        $this->upload->initialize($config_upload);

        if($this->upload->do_upload('photo'))
        {

            $result = array('photo' => $this->upload->data());

            $create_thumb = $this->_thumbnail($result['photo']['file_name']);
            if ($create_thumb != 'success') {
                echo $create_thumb;
                exit;
            }

            return $result['photo']['file_name'];
        }else {
            return 'failed';
        }

    }

    public function __delete_file($file)
    {
        @unlink($this->storage_path.$file);
        @unlink($this->storage_path.'thumbnail/'.$file);
    }


    /**
     * Image Process
     */

    public function _thumbnail($file_data)
    {

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

        $source_path = $this->storage_path.$file_data;
        $target_path = $this->storage_path.'thumbnail/';
        $config = array(
          'image_library' => 'gd2',
          'source_image' => $source_path,
          'new_image' => $target_path,
          'maintain_ratio' => TRUE,
          'width' => 320,
          );

        $this->image_lib->clear();
        $this->image_lib->initialize($config);

        if (!$this->image_lib->resize()) {
            return $this->image_lib->display_errors();
        }
        else {

            return 'success';
        }        
    }       

}

4. Membuat View

  • Buat folder crud didalam folder app (pathnya daily_codeigniter/application/views/app/crud)
  • Buat file index.php didalam folder app (pathnya daily_codeigniter/application/views/app/crud/index.php)
  • isi dengan kode ini
<?php $this->load->view('app/_layouts/header'); ?>
<?php $this->load->view('app/_layouts/sidebar'); ?>

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

        <div class="c-card c-card--responsive h-100vh u-p-zero">
            <div class="c-card__header c-card__header--transparent o-line">
                <a class="c-btn--custom c-btn--small c-btn c-btn--info" href="<?php echo base_url('app/crud/create') ?>">
                    <i class="fa fa-plus"></i>
                </a>           
            </div>
            <div class="c-card__body">
                <?php $this->load->view('app/_layouts/alert'); ?>


                <div class="c-table-responsive">

                    <table class="c-table c-table--zebra" style="display: table;">
                        <thead class="c-table__head">
                            <tr class="c-table__row">
                                <th class="c-table__cell c-table__cell--head">user</th>
                                <th class="c-table__cell c-table__cell--head">birthday</th>
                                <th class="c-table__cell c-table__cell--head">hobby</th>
                                <th class="c-table__cell c-table__cell--head">about</th>
                                <th class="c-table__cell c-table__cell--head">tools</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php if ($biodata): ?>
                                <?php foreach ($biodata as $data): ?>
                                    <tr class="c-table__row">
                                        <td class="c-table__cell">
                                            <?php if ($data['photo']): ?>
                                                <div class="o-media__img u-mr-xsmall">
                                                    <a target="_blank" href="<?php echo base_url("storage/uploads/thumbnail/{$data['photo']}") ?>"><img width="60" src="<?php echo base_url("storage/uploads/thumbnail/{$data['photo']}") ?>" alt="<?php echo $data['name'] ?>"/></a>
                                                </div>
                                            <?php endif ?>
                                            <div class="o-media__body">
                                                <?php echo $data['name'] ?> 
                                                <span class="u-block u-text-mute u-text-xsmall"><?php echo $data['gender'] ?></span>
                                            </div>
                                        </td>
                                        <td class="c-table__cell">
                                            <?php echo $data['birthday'] ?> 
                                        </td>
                                        <td class="c-table__cell">
                                            <?php echo $data['hobby'] ?> 
                                        </td>
                                        <td class="c-table__cell">
                                            <?php echo $data['about'] ?> 
                                        </td>
                                        <td class="c-table__cell">
                                            <a class="c-btn c-btn--info c-btn--custom" href="<?php echo base_url('app/crud/update/'.$data['id']) ?>">
                                                <i class="fa fa-edit"></i>
                                            </a>
                                            <button class="c-btn c-btn--danger c-btn--custom action-delete" data-href="<?php echo base_url('app/crud/process_delete/'.$data['id']) ?>">
                                                <i class="fa fa-trash"></i>
                                            </button>
                                        </td>
                                    </tr>
                                <?php endforeach ?>
                            <?php else: ?>
                                <tr>
                                    <td class="c-table__cell u-text-center" colspan="8">No Content</td>
                                </tr>
                            <?php endif ?>
                        </tbody>
                    </table>

                </div>

            </div>
        </div>
    </div>
</div>

<?php $this->load->view('app/_layouts/footer'); ?>
  • Buat file form.php didalam folder crud (pathnya daily_codeigniter/application/views/app/crud/form.php)
  • isi dengan kode ini
<?php $this->load->view('app/_layouts/header'); ?>
<?php $this->load->view('app/_layouts/sidebar'); ?>


<div class="container-fluid">   
    <div class="row">

        <div class="col-12">
            <form action="<?php echo ($update == true) ? base_url('app/crud/process_update/'.$biodata['id']) : base_url('app/crud/process_create') ?>" class="row" method="post" enctype="multipart/form-data">

                <div class="col-12 col-xl-9 col-lg-9 u-p-zero">

                    <div class="c-card c-card--responsive h-100vh u-p-zero">
                        <div class="c-card__header c-card__header--transparent o-line">
                            <button class="c-btn c-btn--info" name="publish" type="submit" title="publish">
                                <i class="fa fa-save" aria-hidden="true"></i>
                            </button>
                        </div>
                        <div class="c-card__body u-p-small">

                            <div class="c-field u-mb-small">
                                <label class="c-field__label u-text-uppercase">name : </label>
                                <input autofocus="" value="<?php echo (!empty($biodata['name']) ? $biodata['name'] : '') ?>" class="c-input" name="name" id="name" type="text" placeholder="name">

                                <?php if ($this->session->flashdata('name')): ?>                                    
                                    <small class="c-field__message u-color-danger">
                                        <i class="fa fa-times-circle"></i><?php echo $this->session->flashdata('name') ?>
                                    </small>
                                <?php endif ?>
                            </div>

                            <div class="c-field u-mb-small">
                                <p class="u-text-mute u-text-uppercase u-mb-small">gender</p>

                                 <?php if ($this->session->flashdata('gender')): ?>                                    
                                    <small class="c-field__message u-color-danger">
                                        <i class="fa fa-times-circle"></i><?php echo $this->session->flashdata('gender') ?>
                                    </small>
                                <?php endif ?>
                            </div>
                            <div class="c-choice c-choice--radio">
                                <input class="c-choice__input" id="male" name="gender" type="radio" value="male" <?php echo (!empty($biodata['gender']) AND $biodata['gender'] == 'Male') ? 'checked' : ''  ?>>
                                <label class="c-choice__label" for="male">Male</label>
                            </div>
                            <div class="c-choice c-choice--radio">
                                <input class="c-choice__input" id="female" name="gender" type="radio" value="female" <?php echo (!empty($biodata['gender']) AND $biodata['gender'] == 'Female') ? 'checked' : ''  ?>>
                                <label class="c-choice__label" for="female">Female</label>
                            </div>

                            <label class="c-field__label u-text-uppercase">birthday</label>
                            <div class="c-field has-icon-right u-mb-small">
                                <span class="c-field__icon">
                                    <i class="fa fa-calendar"></i>
                                </span>
                                <input name="birthday" readonly="" class="c-input" data-toggle="datepicker" type="text" placeholder="select date" value="<?php echo (!empty($biodata['birthday']) ? date('m-d-Y', strtotime($biodata['birthday'])) : '') ?>">

                                <?php if ($this->session->flashdata('birthday')): ?>                                    
                                    <small class="c-field__message u-color-danger">
                                        <i class="fa fa-times-circle"></i><?php echo $this->session->flashdata('birthday') ?>
                                    </small>
                                <?php endif ?>
                            </div>

                            <div class="c-field u-mb-small">
                                <label class="c-field__label u-text-uppercase">photo : </label>
                                <?php if (!empty($biodata['photo'])): ?>
                                    <img width="100px" src="<?php echo (!empty($biodata['photo']) ? base_url("storage/uploads/thumbnail/{$biodata['photo']}") : '') ?>" alt="photo">
                                <?php endif ?>
                                <input class="c-input" name="photo" id="photo" type="file" placeholder="photo">
                            </div>

                            <div class="c-field u-mb-small">
                                <label class="c-field__label u-text-uppercase">hobby : </label>
                                <input autofocus="" value="<?php echo (!empty($biodata['hobby']) ? $biodata['hobby'] : '') ?>" class="c-input" name="hobby" id="hobby" type="text" placeholder="hobby">

                                <?php if ($this->session->flashdata('hobby')): ?>                                    
                                    <small class="c-field__message u-color-danger">
                                        <i class="fa fa-times-circle"></i><?php echo $this->session->flashdata('hobby') ?>
                                    </small>
                                <?php endif ?>
                            </div>

                            <div class="c-field u-mb-small">
                                <label class="c-field__label u-text-uppercase">about : </label>
                                <textarea rows="5" autofocus="" class="c-input" name="about" id="about" type="text" placeholder="about"><?php echo (!empty($biodata['about']) ? $biodata['about'] : '') ?></textarea>

                                <?php if ($this->session->flashdata('about')): ?>                                    
                                    <small class="c-field__message u-color-danger">
                                        <i class="fa fa-times-circle"></i><?php echo $this->session->flashdata('about') ?>
                                    </small>
                                <?php endif ?>
                            </div>  

                        </div>

                    </div>                

                </div>

            </form>

        </div>

    </div>
</div>

<?php $this->load->view('app/_layouts/footer'); ?>

5. Menambah Menu Navigasi

  • buka file nav.php (pathnya daily_codeigniter/application/views/app/_layouts/nav.php)
  • ganti isi kode didalamnya menjadi kode dibawah ini
<li class="c-sidebar__item">
 <a class="c-sidebar__link <?php if($this->uri->segment(1)=="app" and empty($this->uri->segment(2)) or $this->uri->segment(2) == 'dashboard'){echo "is-active";}?>" href="<?php echo base_url('app/dashboard') ?>">
  <i class="fa fa-fire u-mr-xsmall"></i>Dashboard
 </a>
</li>

<h4 class="c-sidebar__title">First App</h4>

<li class="c-sidebar__item">
 <a class="c-sidebar__link <?php if($this->uri->segment(2)=='crud' or $this->uri->segment(2)=='crud' and $this->uri->segment(3) == 'create' ){echo "is-active";}?>" href="<?php echo base_url('app/crud') ?>">
  <i class="fa fa-fire u-mr-xsmall"></i> Crud
 </a>
</li>

6. Menambahkan Sweet Alert

  • buka file all-modules.js (pathnya daily_codeigniter/storage/app/js/all-modules.js)
  • tambahkan kode sweetalert dibawah ini 

7. Konfigurasi Sweet Alert

  • buka file custom.js (pathnya daily_codeigniter/storage/app/js/custom.js)
  • tambahkan kode dibawah ini 
$('.action-delete').click(function(){
    Swal.fire({
        title: 'Are you sure?',
        text: "You Will delete this data !",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: 'Yes'
    }).then((result) => {
        if (result.value) {
            window.location.href = $(this).data('href');
        }
    })
});

8. Membuat Folder Uploads

folder uploads ini nantinya untuk menampung file gambar yang berhasil diupload pada proses crud
  • buat folder uploads didalam folder storage (pathnya daily_codeigniter/storage/uploads)
  • buat folder thumbnail didalam folder storage (pathnya daily_codeigniter/storage/uploads/thumbnail)

9. Ujicoba Proses

  • jalankan projectnya dengan membuka url
  • http://localhost/daily_codeigniter/app/crud
0 Komentar
CodeIgniter

Artikel Terkait

Komentar

Posting Komentar