Lompat ke konten Lompat ke sidebar Lompat ke footer

Operasi CRUD (Create Read Update Delete) pada Laravel Part 2

crud laravel part2

pada artikel sebelumnya Operasi CRUD (Create Read Update Delete) pada Laravel Part 1 kita sudah melakukan beberapa hal diantaranya adalah :

  1. Membuat Database
  2. Membuat Migrasi
  3. Seeding ke table Mahasiswa
  4. Membuat Model Mahasiswa
  5. Membuat Controller MahasiswaController
  6. Membuat Routing menggunakan MahasiswaController
  7. Memodifikasi Function index untuk menampilkan data mahasiswa
Jangan Lanjutkan dulu jika belum membaca/praktek pada artikel sebelumnya. jika sudah mari kita lanjutkan.

Modifikasi Routing

pada praktek berikutnya kita akan menggunakan routing menggunakan resource agar lebih simple dan sesuai dengan standar routing yang digunakan pada laravel, dengan menggunakan resource pada routing maka fungsi bawaan seperti index,create,edit,store,destroy akan secara otomatis terbaca sehingga kita tidak perlu mendefiniskan satu persatu. ubah pada routes/web.php menjadi seperti berikut :


Route::group(['prefix' => 'mhs'], function () {
Route::resource('/mahasiswa', 'MahasiswaController');
Route::get('/search', ['uses' => 'MahasiswaController@search', 'as' => 'mahasiswa.search']);
});

Fungsi Search 

fungis search digunakan untuk melakukan penarian data, pada coding berikut fungsi search digunakan untuk melakukan pencarian berdasarkan nim,nama dan prodi, berikut adalah fungsi search yang ada pada MahasiswaController.php


public function search(Request $request)
{
$txt_cari = $request->get("txt_cari");
$data = Mahasiswa::where("nim", "$txt_cari")
->orWhere("nama", "LIKE", "%$txt_cari%")
->orWhere("prodi", "LIKE", "%$txt_cari%")
->get();
return view('mahasiswa.index', ['data' => $data]);
}

View pada Laravel

View adalah sebuah konsep yang digunakan oleh framework laravel  untuk mengelola tampilan pada sebuah halaman web, pengelolaan tampilan pada laravel agak sedikit berbeda karena menggunakan sebuah template engine yang dinamakan dengan Blade, dengan menggunakan Blade akan mempermudah dalam mengelola tampilan selain itu terdapat fitur lain yang dapat digunakan untuk manipulasi data pada view yang dikirim oleh controller, setiap extension/nama file yang berada pada view akan dinamai dengan .blade.php

Folder view berada di resources/views/ sebagai percobaan sebelum kita mulai pada studi kasus, buatlah folder baru dengan nama mahasiswa/mahasiswa.blade.php sehingga menjadi resources/views/mahasiswa/index.blade.php


@extends("layouts.app")
@section('judul')
Data Mahasiswa
@endsection
@section('konten')
@if(session('status'))
<div class="alert alert-success">
{{session('status')}}
</div>
@endif
<form action="{{ route('mahasiswa.search') }}" method="GET">
<div class="row">
<div class="col-md-5">
<input name="txt_cari" type="text" class="form-control" placeholder="Pencarian data">
</div>

<div class="col-md-2">
<input type="submit" value="Filter" class="btn btn-primary">
</div>
</div>
</form>
<a class="btn btn-success float-right" href="{{ route('mahasiswa.create') }}">Tambah</a>
<br /><br />
<table class="table table-striped table-dark table-bordered">
<thead>
<tr>
<td class="text-center">No</td>
<td>NIM</td>
<td>Nama</td>
<td>Prodi</td>
<td colspan="2" class="text-center">Action</td>
</tr>
</thead>
@foreach ($data as $index =>$datas)
<tr>
<td class="text-center">{{ $index+1 }}</td>
<td>{{ $datas->nim }}</td>
<td>{{ $datas->nama }}</td>
<td>{{ $datas->prodi }}</td>
<td class="text-center">
<a class="btn btn-success" href="{{route('mahasiswa.edit', ['id' => $datas->id])}}">Edit</a>
</td>
<td class="text-center">
<form method="POST" class="d-inline" onsubmit="return confirm('Yakin dihapus?')"
action="{{route('mahasiswa.destroy', ['id' => $datas->id ])}}">
@csrf
<input type="hidden" value="DELETE" name="_method">
<input type="submit" value="Hapus" class="btn btn-danger btn-sm">
</form>
</td>
</tr>
@endforeach
</table>
@endsection

Modifikasi fungsi index pada MahasiswaController dengan menambahkan coding seperti berikut :


public function index()
{
$data = AppModelMahasiswa::all();
return view("mahasiswa.index", ["data" => $data]);
}

Modifikasi fungsi tambah() untuk masuk kedalam halaman tambah data sebagai berikut :


public function create()
{
return view("mahasiswa.create");
}

coding diatas ketika dijalankan akan mengarah kepada file tambah.blade.php pada folder resources/views/mahasiswa/create.blade.php


@extends("layouts.app")
@section('judul')
Tambah Mahasiswa
@endsection
@section('konten')
<h1>Tambah Data Mahasiwa</h1>

<form action="{{ route('mahasiswa.store') }}" method="POST">
@csrf
<div class="container">
<div class="form-group">
<label for="nim" class="col-sm-1-12 col-form-label">NIM</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="nim" id="nim" placeholder="Masukan NIM">
</div>
</div>
<div class="form-group">
<label for="nama" class="col-sm-1-12 col-form-label">Nama</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="nama" id="nama" placeholder="Masukan Nama">
</div>
</div>

<div class="form-group">
<label for="prodi" class="col-sm-1-12 col-form-label">Prodi</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="prodi" id="prodi" placeholder="Masukan Prodi">
</div>
</div>
<div class="form-group">
<div class="col-sm-1-12">
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</div>
</div>
</form>
@endsection

Ketika tombol ditekan akan mengarah kepada fungsi store() pada MahasiswaController sebagai berikut :


public function store(Request $request)
{
$mhs = new Mahasiswa();
$mhs->nim = $request->get("nim");
$mhs->nama = $request->get("nama");
$mhs->prodi = $request->get("prodi");
$mhs->save();
$data = Mahasiswa::all();
return view("mahasiswa.index", ["data" => $data]);
}

Pada file index.blade.php telah ditambahkan dua buah tombol untuk melakukan edit dan hapus data :

        <td class="text-center">
<a class="btn btn-success" href="{{route('mahasiswa.edit', ['id' => $datas->id])}}">Edit</a>
</td>
<td class="text-center">
<form method="POST" class="d-inline" onsubmit="return confirm('Yakin dihapus?')"
action="{{route('mahasiswa.destroy', ['id' => $datas->id ])}}">
@csrf
<input type="hidden" value="DELETE" name="_method">
<input type="submit" value="Hapus" class="btn btn-danger btn-sm">
</form>
</td>

ketika tombol edit ditekan maka akan langsung mengarahkan ke fungsi edit() yang ada pada MahasiswaController,


public function edit($id)
{
$data = Mahasiswa::findOrFail($id);
return view("mahasiswa.edit", ["data" => $data]);
}

Penjelasan :

  1. fungsi findOrFail($id) digunakan untuk mencari data yang akan kita edit berdasarkan id
  2. perintah  return view(“mahasiswa.edit”, [“data” => $data]) digunakan untuk mengakses file edit.blade.php yang berada pada folder view dengan membawa variabel $data yang akan diubah.

berikut adalah coding dari file edit.blade.php


@extends("layouts.app")
@section('judul')
Tambah Mahasiswa
@endsection
@section('konten')
<h1>Data Mahasiwa</h1>
@if(session('status'))
<div class="alert alert-success">
{{session('status')}}
</div>
@endif
<form action="{{route('mahasiswa.update', ['nim' => $data->id])}}" method="POST">
{{ csrf_field() }}
<input type="hidden" value="PUT" name="_method">
<div class="container">
<div class="form-group">
<label for="nim" class="col-sm-1-12 col-form-label">NIM</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="nim" id="nim" value="{{$data->nim}}">
</div>
</div>
<div class="form-group">
<label for="nama" class="col-sm-1-12 col-form-label">Nama</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="nama" id="nama" value="{{$data->nama}}">
</div>
</div>

<div class="form-group">
<label for="prodi" class="col-sm-1-12 col-form-label">Prodi</label>
<div class="col-sm-1-12">
<input type="text" class="form-control" name="prodi" id="prodi" value="{{$data->prodi}}">
</div>
</div>
<div class="form-group">
<div class="col-sm-1-12">
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</div>
</div>
</form>
@endsection

Jika kita perhatikan coding diatas terdapat route(‘mahasiswa.update), coding tersebut digunakan untuk mengupdate data yang kita ubah, route diatas akan mengakses fungsi update() yang ada pada MahasiswaController berikut adalah coding dari fungsi update() :


public function update(Request $request, $id)
{
$mhs = Mahasiswa::findOrFail($id);
$mhs->nim = $request->get("nim");
$mhs->nama = $request->get("nama");
$mhs->prodi = $request->get("prodi");
$mhs->save();
return redirect()->route('mahasiswa.edit', ['id' => $id])->with('status', 'Data berhasil diupdate');
}

selain route update terdapat juga route delete yang digunakan untuk menghapus data, ketika tombol tersebut ditekan akan mengarah ke fungsi destroy() berikut adalah coding dari fungsi tersebut :


public function destroy($id)
{
$mhs = Mahasiswa::findOrFail($id);
$mhs->delete();
return redirect()->route('mahasiswa.index')->with('status', 'Data berhasil dihapus');
}

pada coding diatas terdapat seperti berik ut with(‘status’, ‘Data berhasil dihapus’)/with(‘status’, ‘Data berhasil diupdate’); digunakan untuk mengisi session yang ada pada koding berikut :


@if(session('status'))
<div class="alert alert-success">
{{session('status')}}
</div>
@endif

Sehingga setiap kali berhasil melakukan update/hapus data akan muncul  pemberitahuan berupa alert, sekian Operasi CRUD (Create Read Update Delete) pada Laravel Part 2 jika ada pertanyaan silahkan isi kolom komentar. terimakasih.

Posting Komentar untuk "Operasi CRUD (Create Read Update Delete) pada Laravel Part 2"