Pemrograman CSS HTML Javascript PHP

Cara Membuat Website CRUD dengan Codeigniter

Cara Membuat Website CRUD dengan Codeigniter – Halo Bret!! Kali ini saya akan share ke kalian cara membuat website CRUD dengan menggunakan framework codeigniter. Apa sih CRUD itu ? ya kepanjangannya adalah (Create,Read,Update,Delete). Mungkin di dunia IT bagi programmer akan tidak asing lagi dengan framework satu ini, karena framework tersebut sudah banyak di gunakan oleh developer-developer saat ini,

Oke tidak banyak basa basi kita lanjut saja tutorialnya 😀

Pada pembahasan kali ini, kita akan menyusun banyak hal yang di mulai dari mencreate database, menyiapkan library, mencreate controller, mencreate model, sampai membangun CRUD (Create, Read, Update Delete) adalah fitur dasar yang harus kita buat saat bekerja dengan database.

Kita susun dulu proses pembuatan dari awal :

  1. Create Database
  2. Configurasi Codeigniter
  3. Create Model
  4. Create Controller
  5. Create Form
    • Create Form View Data
    • Create Form Create Data
    • Create Form Update Data
    • Create Form Delete Data

Oke kita mulai dari yang pertama, oh iya sebelumnya kalian harus sudah mempunyai library framework codeigniter yang sudah di taruh directory xampp ya, kalau belum punya silahkan download dulu file Codeigniter nya di link ini.

1. Create database MySql pada PHPmyadmin

Buat tabel dalam database DB_Adin atau terserah kalian.

Setelah itu simpan, dan kita akan mendapatkan data seperti ini. atur id_data menjadi primary key dan auto increment.

langkah selanjutnya yaitu configurasi di dalam codeigniter nya.

2. Configurasi Codeigniter

Silahkan buka application/config/database.php.

Coba perhatikan pada bagian ini :

'hostname' => 'localhost',
'username' => 'root',
'password' => '',
'database' => 'DB_Adin',

kalian ganti sesuai password dan nama database kalian.

Berikutnya, silahkan buka config/autoload.php

Kemudian cari $autoload['libraries'] dan tambahkan database dan session di sana.

Ini artinya, kita akan me-load library database dan session secara otomatis.

Apa fungsinya?

  • Library database akan menyediakan fungsi-fungsi untuk operasi database. Kita butuh ini, karena kita akan menggunakan database dalam aplikasi;
  • Library session menyediakan fungsi-fungsi untuk mengakses variabel $_SESSION. Kita butuh ini untuk menampilkan flash message dan membuat login.

3. Create Model

Silahkan buat file baru di dalam direktori 

Application/model/ dengan nama Data_model.php

Namanya harus diawali dengan huruf kapital. Pada contoh saya tersebut, D adalah huruf kapital, lalu untuk akhiran _model ini bersifat opsional. saya memakai kata _model agar mudah di baca :D.

lalu isikan code berikut.

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

class Data_model extends CI_Model
{
    private $_table = "tb_data";

    public $id_data;
    public $nama_data;
    public $npm_data;
    public $telp_data;

    public function rules()
    {
        return [
            ['field' => 'nama_data',
            'label' => 'Nama_data',
            'rules' => 'required'],

            ['field' => 'npm_data',
            'label' => 'Npm_data',
            'rules' => 'numeric'],
            
            ['field' => 'telp_data',
            'label' => 'Telp_data',
            'rules' => 'required']
        ];
    }

    public function getSemuaData()
    {
        return $this->db->get($this->_table)->result();
    }
    
    public function getByIdData($id)
    {
        return $this->db->get_where($this->_table, ["id_data" => $id])->row();
    }

    public function save()
    {
        $post = $this->input->post();
        $this->nama_data = $post["nama_data"];
        $this->npm_data = $post["npm_data"];
        $this->telp_data = $post["telp_data"];
        $this->db->insert($this->_table, $this);
    }

    public function update()
    {
        $post = $this->input->post();
        $this->id_data = $post["id"];
        $this->nama_data = $post["nama_data"];
        $this->npm_data = $post["npm_data"];
        $this->telp_data = $post["telp_data"];
        $this->db->update($this->_table, $this, array('id_data' => $post['id']));
    }

    public function delete($id)
    {
        return $this->db->delete($this->_table, array("id_data" => $id));
    }
}

Penjelasan Code Di atas :

class Data_model extends CI_Model
{
    private $_table = "tb_data";

    public $id_data;
    public $nama_data;
    public $npm_data;
    public $telp_data;

Berikut adalah code untuk pendeklarasian variabel data yang di public.

Pada variabel $_tabel kita memberikan modifier private, karena properti ini hanya akan digunakan pada class tertentu saja.

public function rules()
    {
        return [
            ['field' => 'nama_data',
            'label' => 'Nama_data',
            'rules' => 'required'],

            ['field' => 'npm_data',
            'label' => 'Npm_data',
            'rules' => 'numeric'],
            
            ['field' => 'telp_data',
            'label' => 'Telp_data',
            'rules' => 'required']
        ];
    }

Method ini akan memberikan nilai balik sebuah array yang berisi rules. Rules ini nanti kita butuhkan untuk validasi input.

public function getSemuaData()
    {
        return $this->db->get($this->_table)->result();
    }

method ini yang nantinya berguna untuk menampilkan data dalam tabel.

sama seperti "SELECT * FROM nama_tabel".

public function getByIdData($id)
{
return $this->db->get_where($this->_table, ["id_data" => $id])->row();
}

method ini berguna untuk mengambil id yang nantinya akan di pakai saat update data. ini sama seperti “SELECT * FROM nama_tabel WHERE id_data = ‘var_data'”;

public function save()
    {
        $post = $this->input->post();
        $this->nama_data = $post["nama_data"];
        $this->npm_data = $post["npm_data"];
        $this->telp_data = $post["telp_data"];
        $this->db->insert($this->_table, $this);
    }

method save ini berguna untuk insert/simpan data pada database.

public function update()
    {
        $post = $this->input->post();
        $this->id_data = $post["id"];
        $this->nama_data = $post["nama_data"];
        $this->npm_data = $post["npm_data"];
        $this->telp_data = $post["telp_data"];
        $this->db->update($this->_table, $this, array('id_data' => $post['id']));
    }

method update ini untuk update data.

public function delete($id)
{
return $this->db->delete($this->_table, array("id_data" => $id));
}

dan yang terakhir method delete ini untuk delete data.

4. Create Controller

Controller bertugas untuk menangani HTTP request dan mensinkronkan Model dengan View. Pada Controller, kita akan memanggil method-method yang ada di dalam data_model untuk mendapatkan data.

lalu data tersebut di-render ke bagian view dengan me-load-nya.

Silahkan buat folder dan file di application/controllers/ dengan nama folder admin dan file Data_control.php.

Saya menggunakan akhiran _control agar mudah dibaca yaa :D.

lalu isikan dengan code berikut :

<?php

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

class Data_control extends CI_Controller
{
    public function __construct()
    {
        parent::__construct();
        $this->load->model("data_model");
        $this->load->library('form_validation');
    }

    public function index()
    {
        $data["ambildata"] = $this->data_model->getSemuaData();
        $this->load->view("admin/lihatdata", $data);
    }

    public function add()
    {
        $dataku = $this->data_model;
        $validation = $this->form_validation;
        $validation->set_rules($dataku->rules());

            if ($validation->run()) {
                $dataku->save();
                $this->session->set_flashdata('success', 'Berhasil disimpan :D');
            }

        $this->load->view("admin/inputdata");
    }

    public function edit($id = null)
    {
        if (!isset($id)) redirect('admin/products');
       
        $dataku = $this->data_model;
        $validation = $this->form_validation;
        $validation->set_rules($dataku->rules());

        if ($validation->run()) {
            $dataku->update();
            $this->session->set_flashdata('success', 'Berhasil disimpan :D');
        }

        $data["ambildata"] = $dataku->getByIdData($id);
        if (!$data["ambildata"]) show_404();
        
        $this->load->view("admin/editdata", $data);
    }

    public function delete($id=null)
    {
        if (!isset($id)) show_404();
        
        if ($this->data_model->delete($id)) {
            redirect(site_url('admin/Data_control'));
        }
    }
}

Penjelasan Code Di atas :

public function __construct()
    {
        parent::__construct();
        $this->load->model("data_model");
        $this->load->library('form_validation');
    }

paket Library pada form_validation akan kita pakai untuk memvalidasi input pada method add() dan edit().

 public function index()
    {
        $data["ambildata"] = $this->data_model->getSemuaData();
        $this->load->view("admin/lihatdata", $data);
    }

method index ini untuk mengambil data GET dari method getSemuaData() pada Data_model untuk menampilkan data dari database.

 public function add()
    {
        $dataku = $this->data_model;
        $validation = $this->form_validation;
        $validation->set_rules($dataku->rules());

            if ($validation->run()) {
                $dataku->save();
                $this->session->set_flashdata('success', 'Berhasil disimpan :D');
            }

        $this->load->view("admin/inputdata");
    }

Method add ini bertugas untuk menampilkan form add dan menyimpan data ke database. Tentunya dengan memanggil method save() yang ada pada Data_model.

Namun, sebelum memanggil method save(), kita lakukan validasi terlebih dahulu dengan mengeksekusi method run() pada objek $validation.

 public function edit($id = null)
    {
        if (!isset($id)) redirect('admin/products');
       
        $dataku = $this->data_model;
        $validation = $this->form_validation;
        $validation->set_rules($dataku->rules());

        if ($validation->run()) {
            $dataku->update();
            $this->session->set_flashdata('success', 'Berhasil disimpan :D');
        }

        $data["ambildata"] = $dataku->getByIdData($id);
        if (!$data["ambildata"]) show_404();
        
        $this->load->view("admin/editdata", $data);
    }


Method edit ini bertugas untuk menampilkan form edit dan menyimpan data ke database. Tentunya dengan memanggil method update() yang ada pada Data_model.

Namun, sebelum memanggil method update(), kita lakukan validasi terlebih dahulu dengan mengeksekusi method run() pada objek $validation.

Oh iya var $id di dapatkan dari mana ? yaitu di dapatkan dari URL, seperti berikut contohnya :

angka 3 adalah nilai id_data yang di ambil.
public function delete($id=null)
    {
        if (!isset($id)) show_404();
        
        if ($this->data_model->delete($id)) {
            redirect(site_url('admin/Data_control'));
        }
    }

method delete ini bertugas untuk menghapus data pada database, Tentunya dengan memanggil method delete() yang ada pada Data_model.

nilai $id nya sama seperti update yaitu di dapatkan dari URL.

5. Create Form View Data, Create Data, Update Data & Delete Data

Silahkan buat file pada Application/views/ buat folder dengan nama adminku dan file dengan nama lihatdata.php, editdata.php, inputdata.php.

Form View Data

Silahkan masukkan code berikut kedalam file lihatdata.php.

<html>
<head>
<title>Website Adinyahya</title>
</head>
<body>
<div class="table-responsive">
    <table class="table table-hover" id="dataTable" width="100%" cellspacing="0">
        <thead>
            <tr>
                <th>No</th>
                <th>Nama</th>
                <th>Npm</th>
                <th>Telp</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            <?php 
            $nomor = 0;
            foreach ($ambildata as $dataku): 
            $nomor++;
            ?>
            <tr>
                <td><?php echo $dataku->nomor; ?></td>
                <td><?php echo $dataku->nama_data ?></td>
                <td><?php echo $dataku->npm_data ?></td>
                <td><?php echo $dataku->telp_data ?></td>
                <td width="100">
                    <a href="<?php echo site_url('admin/data_control/edit/'.$dataku->id_data) ?>"
                        class="btn btn-small"><i class="fas fa-edit"></i> Edit</a>
                    <a href="#myModal" class="btn btn-danger" onclick="set_url('<?php echo site_url('admin/products/delete/'.$product->idpemesan); ?>');" 
                    data-id="3" role="button" data-toggle="modal" ><i class="fa fa-trash"></i> Hapus </a>
                                           
                </td>
            </tr>
            <?php endforeach; ?>
        </tbody>
    </table>
</div>
</body>
<script>
            function set_url(url)
            {
            $('#btn-yes').attr('href',url);
            }
            </script>
</html>

Penjelasa Code Di atas :

Pada variabel nomor berfungsi untuk membuat penomoran, dan saya deklarasikan var yg berisi 0.

Foreach adalah perulangan untuk menampilkan semua data pada tabel. Datanya di dapatkan dari Controller, method index() pada controller Data_control.php.

Form Create Data

Silahkan masukkan code berikut kedalam file inputdata.php.

<?php if ($this->session->flashdata('success')): ?>
    <div class="alert alert-success" role="alert">
        <?php echo $this->session->flashdata('success'); ?>
    </div>
<?php endif; ?>

<form action="<?php base_url('admin/data_control/add') ?>" method="post" enctype="multipart/form-data" >
    
    <label>Name*</label>
    <input class="form-control" type="text" name="nama_data" />
        <div class="invalid-feedback">
            <?php echo form_error('nama_data') ?>
        </div>
    </div>

    <label>Npm*</label>
    <input class="form-control" type="text" name="telp_data" />
        <div class="invalid-feedback">
            <?php echo form_error('npm_data') ?>
        </div>
    </div>
    
    <label>Telp*</label>
    <input class="form-control" type="text" name="telp_data" />
        <div class="invalid-feedback">
            <?php echo form_error('telp_data') ?>
        </div>
    </div>

    <input class="btn btn-success" type="submit" name="btn" value="Simpan" />
</form>

View inputdata.php betugas untuk menampilkan form input untuk pembuatan data baru. Form ini akan mengirim data ke: /Application/data_control/add.

Form Update Data

Silahkan masukkan code berikut kedalam file editdata.php.

<?php if ($this->session->flashdata('success')): ?>
    <div class="alert alert-success" role="alert">
        <?php echo $this->session->flashdata('success'); ?>
    </div>
<?php endif; ?>
        <form action="<?php base_url('admin/product/edit') ?>" method="post" enctype="multipart/form-data">
	    <input type="hidden" name="id" value="<?php echo $dataku->id_data?>" />
        <div class="form-group">
            <label>Name*</label>
            <input class="form-control"
                type="text" name="nama_data" value="<?php echo $dataku->nama_data ?>" />
            <div class="invalid-feedback">
                <?php echo form_error('nama_data') ?>
            </div>
        </div>
        <div class="form-group">
            <label>Npm*</label>
            <input class="form-control"
                type="text" name="npm_data" value="<?php echo $dataku->npm_data ?>" />
            <div class="invalid-feedback">
                <?php echo form_error('npm_data') ?>
            </div>
        </div>
        <div class="form-group">
            <label>Telp*</label>
            <input class="form-control"
                type="text" name="telp_data" value="<?php echo $dataku->telp_data ?>" />
            <div class="invalid-feedback">
                <?php echo form_error('telp_data') ?>
            </div>
        </div>
        <input class="btn btn-success" type="submit" name="btn" value="Save" />
    </form>

View editdata.php betugas untuk menampilkan form update. Form ini akan mengirim data ke: /Application/data_control/edit.

Delete Data

Pada fitur delete data kita akan memakai modal, fungsi modal yaitu berupa konfirmasi perintah hapus. di karenakan jika tidak ada fungsi modal kalian akan bisa kehilangan data .

kalian buat folder ada Application/views/adminku/ dengan nama menu dan buatlah file dengan nama modal.php.

lalu pada file modal.php isikan code berikut.

<div class="modal small fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
            <h3 id="myModalLabel">Delete Confirmation</h3>

                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                 
            </div>
            <div class="modal-body">
                <p class="error-text"><i class="fa fa-warning modal-icon"></i>Anda yakin ingin menghapus ?
                    <br>Data yang sudah di hapus tidak bisa di kembalikan.</p>
            </div>
            <div class="modal-footer">
               <button class="btn btn-default"data-dismiss="modal" aria-hidden="true">Cancel</button> 
               <a id="btn-yes" class="btn btn-danger" >Hapus</a>

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

lihat pada code lihatdata.php pada bagian bawah sendiri adalah fungsi javascript untuk memanggil file modal.php.

<script>
function set_url(url)
{
$('#btn-yes').attr('href',url);
}
</script>

data pada bagian field Action pada lihatdata.php terdapat fungsi onClick untuk memanggil javascript tsb.

Dan akhirnya selesai sudah 😀

Demikian Cara Membuat Website CRUD dengan Codeigniter, silahkan kembangkan lagi sesuai kebutuhan kalian. semoga bermanfaat bagi kalian, selamat mencoba yaaaa 😀

Read Too :

Avatar

Adin Yahya

About Author

Leave a comment

Your email address will not be published. Required fields are marked *

You may also like

Pemrograman Node.js

Cara Membuat Telegram Bot API

Cara Membuat Telegram Bot API – Halo bret kali ini saya akan share cara membuat bot telegram, Telegram merupakan alat
Pemrograman PHP

Cara Membuat Database MySQL di Phpmyadmin

Membuat Database MySQL di Phpmyadmin – Halo bret !! Kali ini saya akan share cara membuat database MySQL di Phpmyadmin,