javascript - 添加 jquery 不显眼的 ajax 脚本文件 Controller 操作运行两次

Question

我想在我的应用程序中添加用户 Ajax.Actionlink 并且为了使它工作我必须添加

jquery.unobtrusive-ajax.min.js

现在我已经添加了它，但奇怪的事情发生了。这是我加载js文件的顺序

   bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-2.1.0.min.js",
                 "~/Scripts/jquery.unobtrusive-ajax.min.js"));

    bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                "~/Scripts/jquery.validate.min.js",
                "~/Scripts/jquery.validate.unobtrusive.min.js"));

布局页面按照我提到的相同顺序加载这个 js 文件所以我的_layout页面有

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")      
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/Scripts/jquery-ui-1.10.4.js")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/Kendo")
@Scripts.Render("~/bundles/toastr")

现在当我从 View 中提交 ajax 表单时

@using (Ajax.BeginForm("AddAttendeeInternalAddressBook", "Attendee", new AjaxOptions { HttpMethod = "POST", OnSuccess = "doneInternalAddressBook" }))
{
     @Html.AntiForgeryToken()
     @Html.ValidationSummary()

    <div class="form-group">             
        @Html.TextBoxFor(m => m.SelectedAddressBookPerson.Email, new {@class = "form-control", PlaceHolder = "Search in AddressBook..." }) &nbsp; &nbsp;               
        <input type="submit" id="btnAddressBook" class="btn btn-default" value="Add>>">           
    </div>
}

这个 Controller 的方法运行了两次

public ActionResult AddAttendeeInternalAddressBook(CreateAppointmentSelectPersons internalAddressbookPerson)
{
    bool result = _attendeeRepository.CheckIfAttendeeExists(internalAddressbookPerson.SelectedAddressBookPerson.AppointmentId, internalAddressbookPerson.SelectedAddressBookPerson.Email);
    if (!result)
    {
        _attendeeRepository.AddInternalAddressBookAttendee(
        internalAddressbookPerson.SelectedAddressBookPerson.AppointmentId,
        internalAddressbookPerson.SelectedAddressBookPerson.FirstName,
        internalAddressbookPerson.SelectedAddressBookPerson.LastName,
        internalAddressbookPerson.SelectedAddressBookPerson.Email);
    }

    return Json(new { AttendeeExists = result, ErrorMessage = "Person already exists in your list" });  
}

所以当我在这个 Action 的第一行放置断点并发布表单时，第一行

bool result = _attendeeRepository.CheckIfAttendeeExists(internalAddressbookPerson.SelectedAddressBookPerson.AppointmentId, internalAddressbookPerson.SelectedAddressBookPerson.Email);

被执行了两次。然后 if 语句被执行两次，然后存储库方法被调用两次。

所以基本上所有的行都被执行了两次。这个人被两次添加到我的数据库中。

但是当我删除线时(不加载)

  "~/Scripts/jquery.unobtrusive-ajax.min.js"

一切都很好。 Controller 中的操作执行一次(按应有的方式)。

我也将 UnobtrusiveJavascriptEnabled 设置为 true

  <appSettings>
    <add key="webpages:Version" value="3.0.0.0" />
    <add key="webpages:Enabled" value="false" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

问题:

任何人都可以解释发生了什么。

为什么当我提交 ajax 表单时， Controller 的 Action 每行被执行两次？

Answer 1

您可能会在应用程序中多次添加 jquery.unobtrusive-ajax.min.js。这样它可能会运行 Controller 两次