Tutorial Laravel 12 #11 : Cara Simple Melakukan Edit dan Update ke Dalam Database

0
79

Setelah melewati step by step tutorial Laravel 12 pada bab sebelumnya, maka pada kesempatan kali ini kita akan menerapkan teknik sederhana dalam melakukan edit dan update data kedalam database di Laravel 12. Seperti kita ketahui, Laravel adalah framework PHP modern yang dirancang dengan pola arsitektur MVC (Model-View-Controller). Melakukan edit data dalam Laravel 12 merupakan salah satu operasi dasar dalam pengembangan aplikasi berbasis web, khususnya dalam pola arsitektur MVC (Model-View-Controller) yang menjadi fondasi framework ini. Proses edit data biasanya melibatkan beberapa komponen utama: routing, controller, model, dan view. Memahami alur ini secara menyeluruh akan membantu Anda membangun fitur edit yang rapi, aman, dan mudah dipelihara.

Pertama, mari kita mulai dari konsep dasarnya. Edit data adalah proses memperbarui data yang sudah tersimpan di database. Dalam Laravel, data biasanya direpresentasikan melalui model yang berinteraksi dengan tabel database menggunakan Eloquent ORM. Ketika pengguna ingin mengedit suatu data, sistem akan menampilkan form yang sudah terisi dengan data sebelumnya. Setelah pengguna melakukan perubahan dan mengirimkan form, sistem akan memproses pembaruan tersebut dan menyimpannya kembali ke database.

Langkah awal adalah mendefinisikan route. Laravel 12 menggunakan pendekatan routing yang fleksibel, biasanya didefinisikan dalam file web.php. Untuk fitur edit, Anda memerlukan dua route utama: satu untuk menampilkan form edit (method GET), dan satu lagi untuk memproses update (method PUT atau PATCH). Contohnya:

//route pegawais
Route::middleware('auth')->group(function () {
    Route::get('/pegawais', [PegawaiController::class, 'index'])
        ->name('pegawais.index');
    Route::get('/pegawais/{id}/edit', [PegawaiController::class, 'edit'])
        ->name('pegawais.edit'); //melakukan edit data
    Route::post('/pegawais/{id}', [PegawaiController::class, 'update'])
        ->name('pegawais.update'); //melakukan update data
});

Route pertama akan memanggil method edit di controller, sementara route kedua akan memanggil method update.

Selanjutnya adalah bagian controller. Controller bertugas mengatur logika aplikasi. Pada method edit, Anda akan mengambil data dari database berdasarkan ID, lalu mengirimkannya ke view. Contohnya:

public function edit(string $id)
    {
        $pegawais = Pegawai::findOrFail($id);
        return view('pegawais.edit', compact('pegawais'));
    }

Method findOrFail akan memastikan bahwa jika data tidak ditemukan, Laravel secara otomatis akan menampilkan halaman 404.

Kemudian, method update bertugas memproses data yang dikirim dari form:

public function update(Request $request, string $id)
    {
        $post = Pegawai::findOrFail($id);

        $request->validate([
            'nama' => 'required',
            'email' => 'required',
            'pekerjaan' => 'required',
            'alamat' => 'required',
        ]);

        $post->update([
            'nama' => $request->nama,
            'email' => $request->email,
            'pekerjaan' => $request->pekerjaan,
            'alamat' => $request->alamat
        ]);

        return redirect()->route('pegawais.index')->with('success', 'Data berhasil diperbarui');
    }

Di sini terlihat bahwa Laravel menyediakan fitur validasi yang sangat praktis. Validasi penting untuk memastikan bahwa data yang masuk sesuai dengan aturan yang ditentukan, sehingga mencegah error maupun potensi celah keamanan.

Berikutnya adalah bagian view. Biasanya menggunakan Blade template engine. Dalam file edit.blade.php, Anda akan membuat form yang sudah terisi dengan data lama. Contohnya:

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
            {{ __('Edit Data Pegawai') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8 space-y-6">            
            <div class="p-4 sm:p-8 bg-white dark:bg-gray-800 shadow sm:rounded-lg">
                <div class="max-w-xl">
                    <form method="post" action="{{ route('pegawais.update', $pegawais->id) }}" class="mt-6 space-y-6">
                        @csrf
                        @method('post')

                        <div>
                            <x-input-label for="nama" :value="__('Nama')" />
                            <x-text-input id="nama" name="nama" type="text" class="mt-1 block w-full" :value="old('nama', $pegawais->nama)" />
                            <x-input-error class="mt-2" :messages="$errors->get('nama')" />
                        </div>
                        <div>
                            <x-input-label for="email" :value="__('Email')" />
                            <x-text-input id="email" name="email" type="text" class="mt-1 block w-full" :value="old('email', $pegawais->email)" />
                            <x-input-error class="mt-2" :messages="$errors->get('email')" />
                        </div>
                        <div>
                            <x-input-label for="pekerjaan" :value="__('Pekerjaan')" />
                            <x-text-input id="pekerjaan" name="pekerjaan" type="text" class="mt-1 block w-full" :value="old('pekerjaan', $pegawais->pekerjaan)" />
                            <x-input-error class="mt-2" :messages="$errors->get('pekerjaan')" />
                        </div>          
                        <div>
                            <x-input-label for="alamat" :value="__('Alamat')" />
                            <textarea id="alamat" name="alamat"
        class="mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-indigo-500 focus:border-indigo-500"
        rows="4">{{ old('alamat', $pegawais->alamat) }}</textarea>
                            <x-input-error class="mt-2" :messages="$errors->get('alamat')" />
                        </div>     

                        <div class="flex items-center gap-4">
                            <x-primary-button>{{ __('Save') }}</x-primary-button>
                        </div>

                    </form>
                </div>
            </div>            
        </div>
    </div>
</x-app-layout>

Perhatikan penggunaan @csrf untuk keamanan, serta @method(‘POST’) karena HTML form hanya mendukung GET dan POST secara default. Laravel menyediakan spoofing method untuk mengatasi hal ini.

Fungsi old() digunakan agar jika validasi gagal, input sebelumnya tidak hilang. Ini meningkatkan pengalaman pengguna karena mereka tidak perlu mengisi ulang semua data.

Dalam Laravel 12, praktik terbaik juga mencakup penggunaan mass assignment dengan pengamanan melalui properti $fillable atau $guarded di model. Contohnya:

protected $fillable = [
        ‘nama’,
        ’email’,
        ‘pekerjaan’,
        ‘alamat’,
    ];

Dengan ini, hanya field tertentu yang boleh diupdate secara massal, sehingga mencegah manipulasi data yang tidak diinginkan.

Perhatikan pada validasi diatas kita telah menyertakan syarat semua kolom yang tersedia harus diisi, apabila kita melewatkan sebuah kolom maka akan tampil form dengan pesan pada kolom yang kosong seperti contoh berikut :

Laravel 12 Edit Update Data

Sehingga apabila berhasil, maka kita akan menemukan halaman index blade yang menampilkan bahwa data berhasil diupdate seperti contoh berikut :

Laravel 12 Edit Update Data Ke Dalam Database

Selain itu, Laravel juga mendukung penggunaan Form Request untuk memisahkan logika validasi dari controller. Ini membuat kode lebih bersih dan terstruktur. Anda bisa membuatnya dengan perintah artisan:

php artisan make:request UpdatePostRequest

Kemudian, Anda definisikan aturan validasi di dalam class tersebut, dan gunakan di controller:

public function update(UpdatePostRequest $request, $id)
{

    $post = Pegawai::findOrFail($id);

    $post->update($request->validated());

    return redirect()->route('pegawais.index');
}

Pendekatan ini sangat dianjurkan dalam aplikasi skala besar.

Selain aspek dasar, ada juga hal penting lain seperti otorisasi. Laravel menyediakan Gate dan Policy untuk mengatur siapa yang boleh mengedit data. Misalnya, hanya pemilik data yang boleh mengedit postingannya. Ini bisa diimplementasikan menggunakan policy:

$this->authorize(‘update’, $post);

Dengan demikian, keamanan aplikasi menjadi lebih terjamin.

Dalam konteks pengalaman pengguna, Anda juga bisa menambahkan notifikasi sukses atau error menggunakan session flash. Hal ini membantu memberikan feedback yang jelas kepada pengguna setelah mereka melakukan update.

Terakhir, penting untuk memahami bahwa mengedit data di Laravel 12 bukan hanya soal mengubah isi database, tetapi juga menjaga konsistensi, validitas, dan keamanan data. Oleh karena itu, selalu pastikan untuk menerapkan validasi, otorisasi, dan sanitasi input dengan baik.

Dengan memahami seluruh alur mulai dari route, controller, model, hingga view, Anda dapat membangun fitur edit data yang efisien dan sesuai dengan standar best practice Laravel 12.