Notification message Asp.net Core

Question

Im trying to display a notification after an OnPost in razor pages. Because I want a page refresh to update the page data, I cant use return Page() and have to use return RedirectToPage()

Because of that, the [Tempdata] concept doesn't work and the message is null because it goes through the OnGet again.

Any ideas how I can overcome the issue? Thats my code:

     public async Task<IActionResult> OnPostAddPerson()
    {
        try
        {
            if (ModelState.IsValid)
            {
                await _repo.AddPerson(person);
                Message = "Success";

            }
            else
            {
                Message = "An Error occured";
            }

        }
        catch(Exception ex)
        {
            throw ex;
        }

        return RedirectToPage("/Index");
    }

Answer 1

For this, you need to install third party package called

Install-Package NToastNotify

In this package, you will get server side toast notification rendering. Including Ajax Call, XMLHTTPRequests.

using NToastNotify.Libraries;


services.AddMvc().AddNToastNotifyToastr(new ToastrOptions()
{
            ProgressBar = false,
            PositionClass = ToastPositions.BottomCenter
});

//Or simply go 
services.AddMvc().AddNToastNotifyToastr();

Add the middleware

 public void Configure(IApplicationBuilder app, IHostingEnvironment env)
 {
        //NOTE this line must be above .UseMvc() line.
        app.UseNToastNotify();

        app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller=Home}/{action=Index}/{id?}");
            });
 }

Add the following line in your html file. Preferably in your Layout Page.

@await Component.InvokeAsync("NToastNotify")

Add your toast messages.

public class HomeController : Controller
    {
        private readonly IToastNotification _toastNotification;

        public HomeController(IToastNotification toastNotification)
        {
            _toastNotification = toastNotification;
        }
        public IActionResult Index()
        {
            //Testing Default Methods

            //Success
            _toastNotification.AddSuccessToastMessage("Same for success message");
            // Success with default options (taking into account the overwritten defaults when initializing in Startup.cs)
            _toastNotification.AddSuccessToastMessage();

            //Info
            _toastNotification.AddInfoToastMessage();

            //Warning
            _toastNotification.AddWarningToastMessage();

            //Error
            _toastNotification.AddErrorToastMessage();

            return View();
        }

        public IActionResult About()
        {
            _toastNotification.AddInfoToastMessage("You got redirected");
            return View();
        }

        public IActionResult Contact()
        {
            _toastNotification.AddAlertToastMessage("You will be redirected");
            return RedirectToAction("About");
        }

        public IActionResult Error()
        {
            _toastNotification.AddErrorToastMessage("There was something wrong with this request.");
            return View();
        }

        public IActionResult Empty()
        {

            return View();
        }

        public IActionResult Ajax()
        {
            _toastNotification.AddInfoToastMessage("This page will make ajax requests and show notifications.");
            return View();
        }

        public IActionResult AjaxCall()
        {
            System.Threading.Thread.Sleep(2000);
            _toastNotification.AddSuccessToastMessage("This toast is shown on Ajax request. AJAX CALL " + DateTime.Now.ToLongTimeString());
            return PartialView("_PartialView", "Ajax Call");
        }

        public IActionResult NormalAjaxCall()
        {
            return PartialView("_PartialView", "Normal Ajax Call");
        }

        public IActionResult ErrorAjaxCall()
        {
            throw new Exception("Error occurred");
        }
    }

Answer 2

You need to return JSON object. because its most widely used for return back object as