Sometimes, we want to add toast notifications with toastr and JavaScript.
In this article, we’ll look at how to add toast notifications with toastr and JavaScript.
How to add toast notifications with toastr and JavaScript?
To add toast notifications with toastr and JavaScript, we can add the toastr script and CSS.
Then we can use the toastr
object to create toasts.
For instance, we write:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.1.4/toastr.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/2.1.4/toastr.min.js"></script>
to add the toastr CSS and JavaScript file and jQuery.
jQuery is required for toastr.
Then we call toastr.success
with a message string to show a success message by writing:
toastr.success('Success messages');
Conclusion
To add toast notifications with toastr and JavaScript, we can add the toastr script and CSS.
Then we can use the toastr
object to create toasts.