.NET MVC 5 Ajax 调用无法在发布后显示 javascript 消息答案

【问题标题】：.NET MVC 5 Ajax call unable to display javascript message after post.NET MVC 5 Ajax 调用无法在发布后显示 javascript 消息
【发布时间】：2017-03-13 12:18:11
【问题描述】：

我在我的 .NET MVC 5 应用程序中创建了一个表单，如下所示：

   @using (Ajax.BeginForm("ChangePassword", "User", new { area = "UserSettings" }, new
  AjaxOptions
  {
  HttpMethod = "POST",
  OnSuccess = "alert('success');" //This will execute once the Ajax call is finished.

  }, null))
  {
  @Html.TextBoxFor(m => m.Password, new { placeholder = "Password", @class = "form-control", @type = "password" })<br />
  @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger", @style = "float:right;" })
  @Html.TextBoxFor(m => m.PasswordConfirm, new { placeholder = "Confirm password", @class = "form-control", @type = "password" })<br />
  @Html.ValidationMessageFor(model => model.PasswordConfirm, "", new { @class = "text-danger", @style = "float:right;" })
  <button type="submit" class="btn btn-primary">Change Password</button>
  }

这是控制器中的方法：

  [HttpPost]
        [ActionName("ChangePassword")]
        public ActionResult ChangePassword(UserSettings model)
        {
            using (var ctx = new myContextEntities())
            {
                var usr = ctx.Users.FirstOrDefault(x => x.Email == User.Identity.Name);
                model.FirstName = usr.FirstName;
                model.LastName = usr.LastName;
                model.Email = usr.Email;
                model.Country = usr.Countries.CountryName;
                if (ModelState.IsValid)
                {
                    usr.PasswordSalt = Helpers.PasswordHelper.CreateSalt(40);
                    usr.PasswordHash = Helpers.PasswordHelper.CreatePasswordHash(model.Password, usr.PasswordSalt);
                    ctx.SaveChanges();
                    return View("UserSettings",model);
                }
                return View("UserSettings", model);
            }
        }

一旦调用完成，页面就会刷新，这不应该发生，但它应该只是显示成功消息......？我在这里做错了什么？

【问题讨论】：

确保布局中添加了所需的 js 库
@EhsanSajjad 我应该为此选项参考哪些？
@EhsanSajjad 我有 jquery，jquery.validate.min.js 和 jquery.validate.unobtrusive.js ...
你把这个加入了吗--> nuget.org/packages/Microsoft.jQuery.Unobtrusive.Ajax
使用 AJAX 表单时，可以选择用结果替换内部表单内容，但这意味着您必须从操作方法返回 PartialView。

标签： javascript jquery ajax asp.net-mvc asp.net-mvc-4

【解决方案1】：

从下面的链接中包含不显眼的 Ajax

Click Here

注意：不要同时包含 jquery.unobtrusive-ajax.min.js 和 jquery.unobtrusive-ajax.min.js，只包含一个 (js/min.js) 文件

以下文件不会对您和您的问题产生任何影响..

1.jquery.validate.min.js
2.jquery.validate.unobtrusive.min.js

【讨论】：

【解决方案2】：

对于 Ajax 请求，请在 BundleConfig.cs 中创建以下包

public static void RegisterBundles(BundleCollection bundles)
{
   //Create Your other bundles here

   //Create your Jquery validate bundle
   bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                "~/Scripts/Assets/jquery.validate.min.js",
                "~/Scripts/Assets/jquery.validate.unobtrusive.min.js",
                "~/Scripts/Assets/jquery.unobtrusive-ajax.min.js"
            ));
}

在您的 _Layout.cshtml 中。将此捆绑包包含为：

  @Scripts.Render("~/bundles/jqueryval")

请确保，jQuery 必须包含在此捆绑包之前。请注意，在上面的代码块中，javascript 文件的路径是虚拟的。你应该给出自己的路径。必须包含以下 JS 文件：

jquery.validate.min.js
jquery.validate.unobtrusive.min.js
jquery.unobtrusive-ajax.min.js

希望对你有帮助:)

【讨论】：