How To Use Toastr Notification In Laravel 9
In this article, we will see how to use toastr notification in laravel 9. Using toastr.js you can display a success message, warning message, and error with the help of a session in laravel 9. So, in this article, we will learn about the laravel 9 toastr notifications example and how to add custom toastr notification messages in laravel 9.
There are many types of notifications available to display different messages in laravel 9 or PHP. Display messages using bootstrap modal, simple pop-up notifications using jquery, display notifications using flash messages, and toastr message notifications. Also, you can customize as per your requirements like a progress bar, close button, and the timing of notification showing.
So, let's see the toastr notification in the laravel 9 example.
you can see the official document of the toastr notification: javascript toast notifications
How To Add Toast Notifications In Laravel 9
First, we will add bootstrap CSS, toastr notification jquery, toastr CSS, and toastr js in the main view blade file, I have added the below CDN in <head> tag.
<head>
<title>How To Add Toastr Notifications In Laravel 9 - 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>
Then after we will add different toastr messages in the 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>
Also, you can customize the toastr notification like the below options example.
toastr.options = {
"closeButton": false,
"debug": false,
"newestOnTop": false,
"progressBar": true,
"positionClass": "toast-top-right",
"preventDuplicates": true,
"onclick": null,
"showDuration": "300",
"hideDuration": "1000",
"timeOut": "5000",
"extendedTimeOut": "1000",
"showEasing": "swing",
"hideEasing": "linear",
"showMethod": "fadeIn",
"hideMethod": "fadeOut"
}
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');
So, we are done with our code for the toastr notifications example in laravel 9.
You might also like:
- Read Also: How To Add Bootstrap Modal In Laravel
- Read Also: How to Add and Delete Rows Dynamically using jQuery
- Read Also: How to Integrate Razorpay Payment Gateway in Laravel
- Read Also: How To Delete Multiple Records Using Checkbox In Laravel
