Pada tutorial laravel sebelumnya kita sudah membuat CRUD Post, kali ini kita akan membuat notifikasi menggunakan toastr.
Tutorial Sebelumnya - Boilerplate Laravel 3 : Membuat CRUD Post
Untuk lebih jelasnya silahkan kunjungi github taostr disini.
Gambar di atas adalah tampilan github toastr, disini kita harus memilih memakai cdn (syarat harus online) atau kita simpan di lokal projek kita. Silahkan pilih sesuai keinginan kalian, pada tutorial ini kita pake cdn langsung karena terhubung dengan internet.
Selanjutnya kita menuju file app.blade.php di dalam folder resource/views/layouts/ untuk memasang library dan script toastr, edit dan perhatikan script dibawah.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script><script>
@if(Session::has('success'))
toastr.success("{{ Session::get('success') }}");
@endif
@if(Session::has('info'))
toastr.info("{{ Session::get('info') }}");
@endif
</script>
Lihat script lengkapnya dibawah.
app.blade.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, initial-scale=1">
<!-- CSRF Token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Styles -->
<link href="/css/app.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
<!-- Scripts -->
<script>
window.Laravel = <?php echo json_encode([
'csrfToken' => csrf_token(),
]); ?>
</script>
</head>
<body>
<div id="app">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<!-- Collapsed Hamburger -->
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#app-navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- Branding Image -->
<a class="navbar-brand" href="{{ url('/') }}">
{{ config('app.name', 'Laravel') }}
</a>
</div>
<div class="collapse navbar-collapse" id="app-navbar-collapse">
<!-- Left Side Of Navbar -->
<ul class="nav navbar-nav">
</ul>
<!-- Right Side Of Navbar -->
<ul class="nav navbar-nav navbar-right">
<!-- Authentication Links -->
@if (Auth::guest())
<li><a href="{{ url('/login') }}">Login</a></li>
<li><a href="{{ url('/register') }}">Register</a></li>
@else
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
{{ Auth::user()->name }} <span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu">
<li>
<a href="{{ url('/logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
Logout
</a>
<form id="logout-form" action="{{ url('/logout') }}" method="POST" style="display: none;">
{{ csrf_field() }}
</form>
</li>
</ul>
</li>
@endif
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
@if(Auth::check())
<div class="col-lg-4">
<ul class="list-group">
<li class="list-group-item">
<a href="{{ route('categories') }}">Category</a>
</li>
<li class="list-group-item">
<a href="{{ route('posts') }}">Post</a>
</li>
</ul>
</div>
@endif
<div class="col-lg-8">
@yield('content')
</div>
</div>
</div>
</div>
<!-- Scripts -->
<script src="/js/app.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script>
@if(Session::has('success'))
toastr.success("{{ Session::get('success') }}");
@endif
@if(Session::has('info'))
toastr.info("{{ Session::get('info') }}");
@endif
</script>
</body>
</html>
Selanjutnya kita tambahkan script untuk notifikasi di setiap proses dilakukan, buka file CategoriesController.php dan PostsController.php di dalam folder app/Http/Controllers/
use Session;
Session::flash('success', 'save success');
Session::flash('success', 'update success');
Session::flash('success', 'delete success');
Session::flash('info', 'category nothing');
Lihat script lengkapnya dibawah
CategoriesController.php
<?php
namespace App\Http\Controllers;
use Session;
use App\Category;
use Illuminate\Http\Request;
class CategoriesController extends Controller
{
public function index()
{
return view('admin.categories.index')->with('categories', Category::all());
}
public function create()
{
return view('admin.categories.create');
}
public function store(Request $request)
{
$this->validate($request, [
"name" => "required|max:225"
]);
$category = new Category;
$category->name = $request->name;
$category->save();
Session::flash('success', 'save success');
return redirect()->route('categories');
}
public function show($id)
{
}
public function edit($id)
{
$category = Category::find($id);
return view('admin.categories.edit')->with('category', $category);
}
public function update(Request $request, $id)
{
$category = Category::find($id);
$category->name = $request->name;
$category->save();
Session::flash('success', 'update success');
return redirect()->route('categories');
}
public function destroy($id)
{
$category = Category::find($id);
$category->delete();
Session::flash('success', 'delete success');
return redirect()->route('categories');
}
}
PostsController.php
<?php
namespace App\Http\Controllers;
use Session;
use App\Post;
use App\Category;
use Illuminate\Http\Request;
class PostsController extends Controller
{
public function index()
{
return view('admin.posts.index')->with('posts', Post::all());
}
public function create()
{
$categories = Category::all();
if($categories->count() == 0){
Session::flash('info', 'category nothing');
return redirect()->back();
}
return view('admin.posts.create')->with('categories', $categories);
}
public function store(Request $request)
{
$this->validate($request, [
"title" => "required",
"featured" => "required|image",
"content" => "required",
"id_category" => "required"
]);
$featured = $request->featured;
$featured_new_name = time().str_replace(' ','-',$featured->getClientOriginalName());
$featured->move('uploads', $featured_new_name);
$post = Post::create([
"title" => $request->title,
"content" => $request->content,
"featured" => "uploads/" . $featured_new_name,
"id_category" => $request->id_category
]);
Session::flash('success', 'save success');
return redirect()->route('posts');
}
public function show($id)
{
}
public function edit($id)
{
$post = Post::find($id);
return view('admin.posts.edit')->with('post', $post)->with('categories', Category::all());
}
public function update(Request $request, $id)
{
$this->validate($request, [
"title" => "required",
"content" => "required",
"id_category" => "required"
]);
$post = Post::find($id);
if($request->hasFile('featured')){
File::delete($post->featured);
$featured = $request->featured;
$featured_new_name = time().str_replace(' ','-',$featured->getClientOriginalName());
$featured->move('uploads', $featured_new_name);
$post->featured = "uploads/".$featured_new_name ;
}
$post->title = $request->title;
$post->content = $request->content;
$post->id_category = $request->id_category;
$post->save();
Session::flash('success', 'update success');
return redirect()->route('posts');
}
public function destroy($id)
{
$post = Post::find($id);
File::delete($post->featured);
$post->delete();
Session::flash('success', 'delete success');
return redirect()->route('posts');
}
}
Bila tidak ada masalah, maka akan ada tampilan notifikasi seperti dibawah.
Sekian untuk tutorial laravel membuat notifikasi dengan toastr, semoga bermanfaat.
Tutorial Selanjutnya - Boilerplate Laravel 5 : Membuat Slug Dan Soft Delete