DEV Community

Techsolutionstuff
Techsolutionstuff

Posted on • Originally published at techsolutionstuff.com

Laravel 8 Toastr Notifications Example

In this tutorial, I will show you laravel 8 toastr notifications example. Using toastr.js you can display a success message, warning message and error with the help of a session in laravel 8.

So, in this post, I will show you how to add toastr notifications in laravel 8 and how to add custom messages in toastr.

There are many types of notification available to display different messages in laravel 8 or PHP like display messages using bootstrap modal, simple pop-up notification using jquery, display notification using flash message, and toastr message notification.

Also, you can customize as per your requirements like a progress bar, close button, the timing of notification showing.

First you need to add bootstrap CSS, toastr notification jquery, toastr CSS and toastr js in you main view blade file, I have added below CDN in

tag.
<head>
    <title>Laravel 8 Toastr Notification Example - Techsolutionstuff</title>

    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0- 
     alpha/css/bootstrap.css" rel="stylesheet">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

    <link rel="stylesheet" type="text/css" 
     href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">

    <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
</head>
Enter fullscreen mode Exit fullscreen mode

Then after we will add differents toastr message in script tag like below.

<script>
  @if(Session::has('message'))
  toastr.options =
  {
    "closeButton" : true,
    "progressBar" : true
  }
        toastr.success("{{ session('message') }}");
  @endif

  @if(Session::has('error'))
  toastr.options =
  {
    "closeButton" : true,
    "progressBar" : true
  }
        toastr.error("{{ session('error') }}");
  @endif

  @if(Session::has('info'))
  toastr.options =
  {
    "closeButton" : true,
    "progressBar" : true
  }
        toastr.info("{{ session('info') }}");
  @endif

  @if(Session::has('warning'))
  toastr.options =
  {
    "closeButton" : true,
    "progressBar" : true
  }
        toastr.warning("{{ session('warning') }}");
  @endif
</script>
Enter fullscreen mode Exit fullscreen mode

After that, we need to display messages in the view file using a redirect URL in the controller. So, we need to add some code in the controller also. So, copy the below code in your controller.

return redirect()->route('your route name')->with('message','Data added Successfully');

return redirect()->route('your route name')->with('error','Data Deleted');

return redirect()->route('your route name')->with('Warning','Are you sure you want to delete? ');

return redirect()->route('your route name')->with('info','This is xyz information');
Enter fullscreen mode Exit fullscreen mode

So, we are done with our code part for toastr notifications example In Laravel 8.

laravel_8_toastr_notifications_example


You might also like :

Discussion (0)