Install-Package NToastNotify
services.AddNToastNotify(new ToastOption()
{
ProgressBar = false,
PositionClass = ToastPositions.BottomCenter
});
Or Simply
services.AddNToastNotify();
This must be added above the
services.AddMvc()
line. The ToastOption parameter acts as the global options for the toast library. If no options are provided the global settings will be the default toastr options.
3. Include the reference to toastr Css and Javascript files in your html.
<link href="toastr.css" rel="stylesheet"/>
<script src="toastr.js"></script>
NOTE: toastr library depends on jQuery
@await Component.InvokeAsync("NToastNotify.Toastr")
This renders the View necessary for the view component
namespace NToastNotify.Web.Controllers
public class HomeController : Controller
{
private readonly IToastNotification _toastNotification;
public HomeController(IToastNotification toastNotification)
{
_toastNotification = toastNotification;
}
public IActionResult Index()
{
//Testing Default Methods
//Success
_toastNotification.AddSuccessToastMessage();
//Info
_toastNotification.AddInfoToastMessage("This is an info message");
//Warning
_toastNotification.AddWarningToastMessage("This is a warning message");
//Wrror
_toastNotification.AddErrorToastMessage();
_toastNotification.AddToastMessage("Custom Title", "My Custom Message", ToastEnums.ToastType.Success, new ToastOption()
{
PositionClass = ToastPositions.BottomLeft
});
return View();
}
public IActionResult About()
{
_toastNotification.AddToastMessage("Success About Title", "My About Warning Message", ToastEnums.ToastType.Warning, new ToastOption()
{
PositionClass = ToastPositions.BottomFullWidth
});
return View();
}
public IActionResult Contact()
{
_toastNotification.AddToastMessage("Redirected...", "You were redirected from Contact Page.", ToastEnums.ToastType.Info, new ToastOption()
{
PositionClass = ToastPositions.TopCenter
});
return RedirectToAction("About"); ;
}
public IActionResult Error()
{
_toastNotification.AddErrorToastMessage("ERROR", "There was something wrong with this request.");
return View();
}
}
and they will be rendered as