NToastNotify 不显示异步消息 post

Question

我在显示 Get（甚至异步）toast 时实施了 NToastNotify。但是在 post 我无法敬酒。

然而，一旦我 return 到页面，消息就会显示...

如何直接在 post 上获取数据保存或错误消息？

=========== 这是我的页面 C# 代码

using System;
using System.Collections.Generic;
using System.Diagnostics.CodeAnalysis;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.EntityFrameworkCore;
using Microsoft.AspNetCore.Mvc.Rendering;
using NToastNotify;
using WorkCollaboration.Data;
using WorkCollaboration.Models;

namespace WorkCollaboration.Pages.Contacts
{ 
    public class CreateModel : PageModel
    {
        private readonly WorkCollaboration.Data.WorkCollaborationContext _context;
        private readonly IToastNotification toastNotification;
        public CreateModel(WorkCollaboration.Data.WorkCollaborationContext context, IToastNotification toastNotification)
        {
            _context = context;
            this.toastNotification = toastNotification;
        }

        public async Task<IActionResult> OnGetAsync()
        {
            CustomerDropDownDisp = await _context.CustomerDropDown.ToListAsync();  // Added for DropDown
            SupplierDropDownDisp = await _context.SupplierDropDown.ToListAsync();  // Added for DropDown

            //Success
            toastNotification.AddSuccessToastMessage("Data Loaded successful");
            
            return Page();
        }


        [BindProperty]
        public Contact Contact { get; set; }
        public IEnumerable<CustomerDropDown> CustomerDropDownDisp { get; set; }
        public IEnumerable<SupplierDropDown> SupplierDropDownDisp { get; set; }

        // To protect from overposting attacks, enable the specific properties you want to bind to, for
        // more details, see https://aka.ms/RazorPagesCRUD.
        public async Task<IActionResult> OnPostAsync()
        {

            if (!ModelState.IsValid)
            {
                //Error
                toastNotification.AddErrorToastMessage("Model State is invalid");

                return Page();
            }

            _context.Contact.Add(Contact);

            //Success
            toastNotification.AddSuccessToastMessage("Successfully saved");

            await _context.SaveChangesAsync();

            return RedirectToPage("/ContactsOverview/Index");
        }
    }
}

====这是我的页面代码========

我这里没有实现任何东西（以防万一）

@page
@using WorkCollaboration.Models
@using Microsoft.AspNetCore.Localization
@using Microsoft.AspNetCore.Mvc.Localization
@model WorkCollaboration.Pages.Contacts.CreateModel

@{
    ViewData["Title"] = "Create";
    ViewData["RandomId"] = Guid.NewGuid().GetHashCode();
}

@inject IViewLocalizer Localizer
@await Component.InvokeAsync("NToastNotify")

<h1>@Localizer["Create"]</h1>
<h4>@Localizer["Contact"]</h4>
<p>
    <a asp-page="/ContactsOverview/Index">@Localizer["Back to Index"]</a>
</p>
<hr />
<div class="row">
    <div class="col-md-4">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Contact.ContactId" class="control-label"></label>
                <input asp-for="Contact.ContactId" value='@ViewData["RandomId"]' readonly="readonly" class="form-control" />
                <span asp-validation-for="Contact.ContactId" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.LastName" class="control-label"></label>
                <input asp-for="Contact.LastName" class="form-control" />
                <span asp-validation-for="Contact.LastName" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.FirstName" class="control-label"></label>
                <input asp-for="Contact.FirstName" class="form-control" />
                <span asp-validation-for="Contact.FirstName" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.CustomerId" class="control-label"></label>
            </div>
            <select id="CusId" asp-for="CustomerDropDownDisp" asp-items="@(new SelectList(Model.CustomerDropDownDisp,"CusId","CusName"))">
                <option value="" selected disabled>--Choose Customer--</option>
            </select>
            <div class="form-group">
                <input asp-for="Contact.CustomerId" readonly="readonly" class="form-control" />
                <span asp-validation-for="Contact.CustomerId" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.SupplierId" class="control-label"></label>
            </div>
            <select id="SupId" asp-for="SupplierDropDownDisp" asp-items="@(new SelectList(Model.SupplierDropDownDisp,"SupId","SupName"))">
                <option value="" selected disabled>--Choose Supplier--</option>
            </select>
            <div class="form-group">
                <input asp-for="Contact.SupplierId" readonly="readonly" class="form-control" />
                <span asp-validation-for="Contact.SupplierId" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivateStreet" class="control-label"></label>
                <input asp-for="Contact.PrivateStreet" class="form-control" />
                <span asp-validation-for="Contact.PrivateStreet" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivateStreetNo" class="control-label"></label>
                <input asp-for="Contact.PrivateStreetNo" class="form-control" />
                <span asp-validation-for="Contact.PrivateStreetNo" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivateStreetAdditionalInfo" class="control-label"></label>
                <input asp-for="Contact.PrivateStreetAdditionalInfo" class="form-control" />
                <span asp-validation-for="Contact.PrivateStreetAdditionalInfo" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivateZip" class="control-label"></label>
                <input asp-for="Contact.PrivateZip" class="form-control" />
                <span asp-validation-for="Contact.PrivateZip" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivateTown" class="control-label"></label>
                <input asp-for="Contact.PrivateTown" class="form-control" />
                <span asp-validation-for="Contact.PrivateTown" class="text-danger"></span>
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.Contact.PrivateCountry, htmlAttributes: new { @class = "form-group" })
                <div class="form-group">
                    @Html.DropDownListFor(model => model.Contact.PrivateCountry, new List<SelectListItem>
                    {
                        new SelectListItem {Text = "CH", Value = "CH", Selected = true },
                        new SelectListItem {Text = "D", Value = "D" },
                        new SelectListItem {Text = "FL", Value = "FL" },
                    }, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Contact.PrivateCountry, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="form-group">
                <label asp-for="Contact.PrivatePhone" class="control-label"></label>
                <input asp-for="Contact.PrivatePhone" class="form-control" />
                <span asp-validation-for="Contact.PrivatePhone" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.BusinessPhone" class="control-label"></label>
                <input asp-for="Contact.BusinessPhone" class="form-control" />
                <span asp-validation-for="Contact.BusinessPhone" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.MobilePhone" class="control-label"></label>
                <input asp-for="Contact.MobilePhone" class="form-control" />
                <span asp-validation-for="Contact.MobilePhone" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.Mail" class="control-label"></label>
                <input type="email" asp-for="Contact.Mail" class="form-control" />
                <span asp-validation-for="Contact.Mail" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.CusRating" class="control-label"></label>
                <input asp-for="Contact.CusRating" value="0" class="form-control" />
                <span asp-validation-for="Contact.CusRating" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.SupRating" class="control-label"></label>
                <input asp-for="Contact.SupRating" value="0" class="form-control" />
                <span asp-validation-for="Contact.SupRating" class="text-danger"></span>
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.Contact.CusBadges, htmlAttributes: new { @class = "form-group" })
                <div class="form-group">
                    @Html.DropDownListFor(model => model.Contact.CusBadges, new List<SelectListItem>
                    {
                        new SelectListItem {Text = "None", Value = "None", Selected = true },
                        new SelectListItem {Text = "Iron", Value = "Iron" },
                        new SelectListItem {Text = "Bronze", Value = "Bronze" },
                        new SelectListItem {Text = "Silver", Value = "Silver" },
                        new SelectListItem {Text = "Gold", Value = "Gold" },
                        new SelectListItem {Text = "Platin", Value = "Platin" },
                    }, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Contact.CusBadges, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.Contact.SupBadges, htmlAttributes: new { @class = "form-group" })
                <div class="form-group">
                    @Html.DropDownListFor(model => model.Contact.SupBadges, new List<SelectListItem>
                    {
                        new SelectListItem {Text = "None", Value = "None", Selected = true },
                        new SelectListItem {Text = "Iron", Value = "Iron" },
                        new SelectListItem {Text = "Bronze", Value = "Bronze" },
                        new SelectListItem {Text = "Silver", Value = "Silver" },
                        new SelectListItem {Text = "Gold", Value = "Gold" },
                        new SelectListItem {Text = "Platin", Value = "Platin" },
                    }, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Contact.SupBadges, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="form-group">
                <label asp-for="Contact.CusPoints" class="control-label"></label>
                <input asp-for="Contact.CusPoints" value="0" class="form-control" />
                <span asp-validation-for="Contact.CusPoints" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Contact.SupPoints" class="control-label"></label>
                <input asp-for="Contact.SupPoints" value="0" class="form-control" />
                <span asp-validation-for="Contact.SupPoints" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
                <a href="/ContactsOverview/Index" class="btn btn-primary">@Localizer["Back to List"]</a>
            </div>
        </form>
    </div>
</div>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
<script>
    $("#CusId").on("change", function () {
        $("#Contact_CustomerId").val($("#CusId").val());
    });
    $("#SupId").on("change", function () {
        $("#Contact_SupplierId").val($("#SupId").val());
    });
</script>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

感谢您的支持

Answer 1

您可以将此行移动到布局页面。

@await Component.InvokeAsync("NToastNotify")

因此，即使您重定向到另一个页面，通知仍会显示。

NToastNotify 不显示异步消息 post

NToastNotify doesn't show message on async post

toast

razor

asp.net-core