表单提交后 ASP.net MVC 成功警报

Question

我想在表单提交和操作成功后显示成功弹出警报或警报消息
在此示例中，我想显示“成功添加”： Create Action：

[HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Create(TAUX taux)
    {
        if (ModelState.IsValid)
        {
            db.TAUX.Add(taux);
            db.SaveChanges();
            return RedirectToAction("Index");
        }

        ViewBag.CAT_ID = new SelectList(db.CATEGORIE, "CAT_ID", "LIBELLE", taux.CAT_ID);
        ViewBag.C_GARANT = new SelectList(db.GARANTIE, "C_GARANT", "LIB_ABREGE", taux.C_GARANT);
        return PartialView("_Create", taux);
    }

Index Action：

public ActionResult Index()
        {
            var taux = db.TAUX.Include(t => t.CATEGORIE).Include(t => t.GARANTIE);
            return View(taux.ToList());
        }

我应该添加什么来做到这一点？

Answer 1

这是可能的，当然，但实施细节可能会因技术和应用结构而异。

执行此操作的最常见方法之一（我目前使用的方法非常成功）是接收 whater-you-need-to-receive 并返回带有状态和/或错误消息的 JSON 对象, 这将被您视图上的某些脚本使用。

例如：

[Route(""), HttpPost]
public JsonResult DoSomethingOnTheServer(DoSomethingViewModel vm)
{
   try
   {
      if (DoSomething(vm)) return Success();
      else return Error("The server wasn't able to do something right now.");
   }
   catch (Exception err)
   {
      return Error(err.Message);
   }
}

public JsonResult Success() { return Json(new { Success = true, Message = "" }); }
public JsonResult Error(string message) { return Json(new { Success = false, Message = message }); }

这样，您可以执行以下操作：

<script>
   $.ajax({
      url: "/",
      method: "POST",
      data: getMyData(),

      success: function(json) {
         if (json.Success) {
            alert("Wow, everything was fine!");
         } else {
            alert(json.Message);
         }
      },

      // This will be trigered whenever your ajax call fails (broken ISP link, etc).
      error: function() {
         alert("Something went wrong. Maybe the server is offline?");
      }
   });
</script>

老实说，您可以提交表单（我的意思是定期提交）并在页面刷新时显示您想要的任何内容。

但是，这将迫使您在视图模型中加载额外的内容，例如额外的 <script> 标记或一些额外的 <div> 标记，并且每次都要检查。

从可用性/设计的角度来看，这是不行的。尽可能避免页面刷新，因为它们会给用户一种应用正在消失或他/她现在正在移出应用的感觉。

此外，从性能的角度来看，“完整往返”到服务器，包括发送表单数据和检索一个全新的页面（包括整个布局、脚本、razor 渲染/解析和所有) 是一个巨大的问题，只是为了向最终用户显示“成功/失败”，所以再次重申：尽可能避免它。

恕我直言，返回视图或部分视图只是为了向最终用户显示消息只是浪费你的和您的最终用户的链接。

Answer 2

我曾经制作过 Ajax 表单，并在 OnSuccess 功能中显示消息：

@using (Ajax.BeginForm("Edit1", "Availability", new AjaxOptions { HttpMethod = "POST", InsertionMode = InsertionMode.InsertBefore, UpdateTargetId = "formAddAvailabilityContainer", OnSuccess = "AddAvailabilitySuccess" }, new { @class = "AjaxForm", @id = "formAvailability_" + Model.Id }))
    {
        @Html.ValidationSummary(true)




        @Html.HiddenFor(model => model.Id)
        @Html.HiddenFor(model => model.UserId)

        @Html.EditorFor(model => model.StartTime)
        @Html.MyValidationMessageFor(model => model.StartTime)

        @Html.EditorFor(model => model.EndTime)
        @Html.MyValidationMessageFor(model => model.EndTime)

        @Html.EditorFor(model => model.RecurrenceFreq)
        @Html.MyValidationMessageFor(model => model.RecurrenceFreq)



      @Html.TextBoxFor(model => model.EndsAfterValue, new {id="txtBoxEndsAfterValue" })
     @Html.MyValidationMessageFor(model => model.EndsAfterValue)



    @Html.EditorFor(model => model.EndsByDate)


    <input type="submit" class="btn btn-primary" value="Save" id="btnsubmit" />
   <input type="button" class="btn btn-primary btnCancelAvailability" id="0" value="Cancel">


    }


 <script>

    function AddAvailabilitySuccess()
    {

    alert("Record updated successfully!");

    }

    </script>

Answer 3

我有办法做到这一点，使用 ViewBag。

您必须在控制器中添加：

if (ModelState.IsValid)
        {
            db.TAUX.Add(taux);
            db.SaveChanges();
            ViewBag.SuccessMsg = "successfully added";
            return RedirectToAction("Index");
        }

然后在索引视图中：

@{
    var message = ViewBag.SuccessMsg;
}

<script type="text/javascript">
    var message = '@message';
    if(message){
        alert(message);
    }
</script>

最后你使用 JavaScript 和 MVC ViewBag :)