UDACODING

Posts

MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

Assalamualaikum warahmatullahi wabarakatuh, pada artikel kali ini saya akan membahasa bagaimana sih cara menambahkan data dan menampilkan list data dengan menggunakan bootstrap flash alert. Disini saya akan menunjukkan bagaimana cara membuat success message

  1. Buat sebuah tabel dengan nama kategori atau sesuai keinginan teman-teman, berikut fieldnya
  1. Lalu buat Model, Controller dan View nya dengan menggunakan perintah php artisan

y9w_KA-_weX71-3euF4_H1Qu71vBLBUfAP6O3UYvltRKcT5YSpzRYrcP8gYlIdiW10_sB7IIjMZNwuRDNmrCQyYWgRy2vOx6vZ8ZGsIInFaeArTwvBF5FlaghWpxAQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Setelah itu buka folder resources > views > layouts lalu buka file app.blade.php lalu buat kodingan untuk menambahkan menu kategori pada halaman dashboard seperti dibawah ini

g8WFo3E4Ap8jRQdPMT1PDbBvUPm0NULxg3vM2DIehBcxdU0_UNY2PmAiD5hY2NST2QqfssSAqPzePNtFVw7nHkyM0rE3dN5aty_OUmsvWOz5GFLSFdnDG84ZT0ugDA MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Lalu buka folder routes > web.php buat kodingan dibawah ini agar nanti ketika di klik pergi ke halaman index
      Route::resource('/kategori', 'KategoriController');
  1. Buka KategoriController.php lalu buat kodingan pada fungsi index seperti dibawah ini, oh ya jangan lupa menambahkan model kategorinya
     <?php
         namespace App\Http\Controllers;
         use Illuminate\Http\Request;
         use App\Kategori;
         class KategoriController extends Controller
         {
       
             public function index()
             {
                 return view('kategori.index')-                 >withKategoris(Kategori::all());
             }
  1. Lalu pada model kategori buat kodingannya seperti dibawah ini agar tabel kategori yang ada di database bisa terpanggil
       <?php
         namespace App;
         use Illuminate\Database\Eloquent\Model;
         class Kategori extends Model
         {
            protected $primaryKey = 'id'; //or null
            protected $table = 'kategori';
            protected $fillable = ['id','name'];
        }
  1. Lalu coba refresh halaman browser web kita, maka akan terlihat seperti pada gambar dibawah ini

VRbwSuyrZbtjQHsoT75XuNNOwZw1uF2fi80eIZ9MSKj_PQmF4s0mfmpL5Nxm_jCvvuudCc6DGkFlGJCtEk2d2PZsjx8YZmq6BCp81BYE0ZB7mNy_YF2VxWfaWxyfQA MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. selanjutnya buka file index.blade.php pada folder kategori, buat kodingan seperti dibawah ini

RW1WowudRpO57t_w0UdYzALzBZGZm5Uz31SCskutvkinI2mMNWMhuhVQWZFJJMptmigXOqIi00gQpGY9rJorTTvCvJvdgdRVGhdJy0gYMnkChank9lsO8gh4dePieQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Refresh halaman web project kita lalu coba klik menu kategori, makan akan muncul pemberitahuan bawah data pada tabel kategori tidak ditemukan karna belum terdapat data kategori

fwU5OfOpvVUKby5-CuR5MYr0qlmqTR7lbhfvwa_kIg6jgZiveajgMqyiiPj7-ER5b_xzdCfOTPc9GL-3lGGcJa27LYZGeAvLwhMJ5mT0WxJT8BTqj0n4A7s-0Pap8A MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Selanjutnya kita akan menambahkan mode card dalam halaman kategori tadi dengan cara buka file index kategori tadi, buat kodingan dibawah iniL-NUDGZfDeVTyugei1xjH_3fSg_gnEahTgyotqttwGUAdPvuMs_yAbW7Y6m0BVrA5dippJrFjOGEW4w2bsA3O7H1qrYj3etGa-l_jP5tBABCrp45AD0FKO8Dmi6E_Q MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

lalu buka brower lalu refresh maka akan terlihat hasil seperti ini, jika belum perhatikan lagi kodingan dari langkah awal

a_UFqrvigy5DYskL93vjX4N2V1--gnTiLNhUczA3YFbvId2E4b4kbGbr-EM1LJ-d4POIUgJC93DF6eV9EB-UT-0LyJukSvJKHa_kqABl4H9rnXf_d0bVD3JtbyBecQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Lalu buka file KategoriController.php buat perintah pada function create() dan function store()
     public function create()
     {
        return view('kategori.add');
     }
  1. Setelah itu buat sebuah file baru pada folder resources > views > kategori dengan nama add.blade.php, lalu buat kodingan untuk tampilan add data kategori
@extends('layouts.app')
@section('content')
    <div class="card">
    <div class="card-header">
    <h2>
    Tambah Kategori
    </h2>
    </div>

    <div class="card-body">
    <form action="{{ route('kategori.store') }}" method="POST">
    @csrf
    <div class="form-group">
    <label for="name">Nama Kategori</label>
    <input type="text" name="name" id="name" class="form-control">
    </div>
    <div class="form-group">
    <input type="submit" value="Simpan" class="btn btn-primary">
    </div>
    </form>
    </div>
    </div>
@endsection
  1. selanjutnya kita buat validasi Request untuk Kategori pada terminal atau cmd YHQlEqUaIyihJb8jOdNhrSxbJ1U1IKN5jiJ8M0GdO0EQ9sArzLt2JcF3FXlRYkkIfqumq4Rc1IGByzPT-4fB-6bbvF2W1reFLHLaacaqGGLIup-1hYAxb75Ia35cXQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

maka pada folder App > Http > Request akan ada file request dari kategori

  1. Lalu buka file KategoriRequest.php tadi ubah kodingan nya menjadi seperti dibawah iniK37JKGQPgZ2PXgC-QwT5RcvnHTxIGW9eHRR1oy_ib9BKGTfAq7Ba9xWXz3S8lL5ktlv9aqMrMEUyg_4gx2lovqrvFvlF6gj5F287Fc9-apQ-3aUxfU542SRwYmKEyA MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP
  1. Buka KategoriController.php lalu samakan kodingannya seperti dibawah iniagIB8O4XH2S5mzNmACVC4_HTjQor3WjwSydXtY-cLRWYNOLeZ_52V7lqVox8k8YXmA0kAlLSeWqBcz9mpANlkRle469AWHy96GUW1IyPY7QTQ63LWCy5WjJbsN3awQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

hNbsaZ4SqqTe3fPNSAI-pxIQk7JUFPeLxuBGP4LyfhsZ8fb5UD0C0LkObcIS-DA-81J6f4x7xAYVZU7UpZhXDuvveD5IE4mYPqz8mcdQGjR6DBY4kzWkMJiRWQ14eA MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

  1. Buka kembali file index.blade.php pada folder kategori lalu tambahkan kodingan pada @if ($kategoris->count() > 0) untuk menampilkan data kategori yang baru saja kita tambahkan4ZRltT_HroJp-2ZQjZJmc58DroKbN4kFaFHy3lOJPHmLiXlG84x706CC8-PuqeW0r9FGovskClmqvBnZTExucLBHCAE6nStxhkALg2N5V48NuZbO1bhnDvIl3elFZQ MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP
  1. Selanjutnya buka file app.blade.php pada folder layouts, lalu tambahkan kodingan berikut ini untuk menampilkan pemberitahuan data berhasil ditambahkan. jLmxVIFzs65vjkDTrZOPDXuCo8oATM4YmSKjgtq7_yUF0Tqj1GeUTlt_dvNb1IsUlOttTjk3TU9YkZfRCJMzTkSHpCBuma27NtL1uoOIiCyPzBlWybF_KqGiaBKC8g MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP
  1. Save All lalu buka browser dan refresh halaman web project laravel maka akan tampil seperti dibawah ini

saat menambahkan data kategori muncul flash session sukses

J00pJ_K4TFE0t4JWGTFSv1m0YqCM7Fzkwbv-4M9PInXNI9n8xnFC4t3W2dyq8EG4GcJTl_Cp_JZHayvMKJUb9qrE7-gWkKUh3NOahpmnPV3YF3GeM_B4yfURE0Fg9A MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

g1m5_SU_ISdK18Kj2oD25iWs_FHJVbZt4wGDSj3gYmYG3PfkIxmldOh9aQJYauP6ERKWmF5LAKJo8Xyo7xcfk1zN5QIEKuajhx120jNNCsKX3WvSniBkRNULbd1Rww MENAMBAH DATA DAN MENAMPILKAN LIST DENGAN FLASH MESSAGES BOOTSTRAP

Leave a Reply :

* Your email address will not be published.