CRUD CodeIgniter 4 #5: Edit Database

By Posted on
CRUD CodeIgniter 4 #5: Edit Database

Mengubah Data atau Edit Database (Update-CRUD)

Membuat CRUD CodeIgniter 4 – Pada artikel ini kita akan belajar CRUD CodeIgniter Edit Database. Di halaman Show Data, kita dapat melihat sebuah tombol aksi dengan nama “Edit”. Bagaimana caranya ketika kita tekan tombol edit , maka data dapat kita ubah.

Adapun untuk melakukan itu, setidaknya kita harus menambahkan kode program kita pada 3 file yaitu didalam route, controller dan view.

Route untuk mengarahkan link ke file, lalu controller untuk mengatur logika pengambilan data dan menyimpan data ke database dan view untuk menampilkan form edit.

Tambahkan Route Edit dan Update

Pertama kita buat routes dulu. Buka file route.php dan tambahkan dua barus kode program berikut : 

$routes->get('/edit/(:segment)', 'UserController::edit/$1');
$routes->post('/update/(:segment)', 'UserController::update/$1');

Silahkan di Save.

Tambahkan Controller

Setelah Route selesai, lalu selanjutnya adalah menambahkan function edit dan update didalam file UserController.php, isikan dengan kode perintah berikut: 

public function edit($id)
    {

        $data = [
            'title' => 'Update Data',
            'data' => $this->userModel->find($id)
        ];

        return view('userEdit', $data);
    }

    public function update($id)
    {
        $this->userModel->update(
            $id,
            [
                'name' => $this->request->getPost('name'),
                'address' => $this->request->getPost('address')
            ]
        );
        return redirect()->to('/show');
    }

Silahkan di Save.

Oke Kontroller sudah siap.

Tambahkan View Data Update

Selanjutnya kita butuh halaman untuk menampilkan data yang mau di edit dan proses edit dibaliknya, maka buatlah sebuah file didalam views dengan nama “userEdit.php”.

Copy semua kode dibawah   lalu pastekan kedalam userAdd.php: 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, tial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    <title><?php echo $title ?></title>
</head>

<body>
    <div class="container">
        <h1 class="mt-5 mb-5" style="text-align: center;">Edit Data</h1>

        <div class="row d-flex justify-content-center">

            <form method="POST" action="/update/<?php echo ($data->id) ?>">
                <?php csrf_field(); ?>
                <div class="mb-3">
                    <label for="name" class="form-label">Input Name:</label>
                    <input name="name" type="text" class="form-control" id="name" aria-describedby="emailHelp" value="<?php echo ($data->name) ?>">
                </div>
                <div class="mb-3">
                    <label for="address" class="form-label">Input Address:</label>
                    <textarea name="address" type="text" class="form-control" id="address" aria-describedby="emailHelp"><?php echo ($data->address) ?></textarea>
                </div>
                <a href="/show" class="btn btn-danger">Back</a>
                <button type="submit" class="btn btn-primary">Save</button>
            </form>
        </div>
    </div>
</body>

</html>

Sekarang, anda dapat tes langsung di kode program  browser, sebagai contoh saya gunakan Google Chrome.

Setelah itu, dari alur CRUD kita tinggal membuat program menghapus data yang ada didatabase. Semoga artikel CRUD CodeIgniter Edit Database ini bermanfaat.