Ajax.BeginForm不会触发AJAX脚本,而是回退回发

Question

我将使用解决方案更新此问题,我想包括我的问题和解决方案,因为我无法在Stackoverflow上找到它.如果您想加入解决方案,请随意.

我有一个使用Visual Studio 2013创建的新创建的"Empty"MVC5项目.如果可能的话,我需要一个来自并且需要AJAX行为.在MVC3中使用Ajax.BeginForm始终是直接的,所以我认为它也将在MVC5中.

但是,当我单击提交按钮时,没有调用我在AjaxOptions中的OnBegin,OnFailure或OnSuccess中指定的javascript函数.而是将一个无Ajax的帖子发送到服务器,通过检查返回false的Request.IsAjaxRequest已证明这是真的.

我得出结论,由于某种原因,ajax根本就没有被使用.我检查了很多东西,比如web.config,我的布局脚本等.

我的布局包括以下脚本:

<script src="~/Scripts/jquery-1.5.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

我的web.config包括:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <appSettings>
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>
</configuration>

我的看法:

@model ContactEnquiryViewModel

@{
AjaxOptions ContactOptions = new AjaxOptions()
{
    OnBegin = "OnConactFormBegin()",    
    OnSuccess = "OnContactFormSuccess()",
    OnFailure = "OnContactFormFailure()"
    };
}

<div id="EnquiryFormContainer">

@using (Ajax.BeginForm("Contact", "Home", new { formName = "EnquiryForm" }, ContactOptions))
    {
    @Html.HiddenFor(m => m.Subject)

    <div class="field">
        @Html.LabelFor(m => m.FirstName)
        @Html.TextBoxFor(m => m.FirstName)
        <div class="validation">
            @Html.ValidationMessageFor(m => m.FirstName)
        </div>
    </div>

    <div class="field">
        @Html.LabelFor(m => m.LastName)
        @Html.TextBoxFor(m => m.LastName)
        <div class="validation">
            @Html.ValidationMessageFor(m => m.LastName)
        </div>
    </div>

    <div class="field">
        @Html.LabelFor(m => m.Email)
        @Html.TextBoxFor(m => m.Email)
        <div class="validation">
            @Html.ValidationMessageFor(m => m.Email)
        </div>
    </div>

    <div class="field">
        @Html.LabelFor(m => m.PhoneNumber)
        @Html.TextBoxFor(m => m.PhoneNumber)
        <div class="validation">
            @Html.ValidationMessageFor(m => m.PhoneNumber)
        </div>
    </div>

    <div class="field">
        @Html.LabelFor(m => m.Comments)
        @Html.TextAreaFor(m => m.Comments)
        <div class="validation">
            @Html.ValidationMessageFor(m => m.Comments)
        </div>
    </div>

    <div id="submitButtonContainer">
        <input type="submit" value="Submit" name="submit" />
    </div>
    }
</div>

我的控制器动作(未完成):

[HttpPost]
public ActionResult Contact(ContactViewModel viewModel, String formName = "")
    {
    if (Request.IsAjaxRequest())
        {
        return new EmptyResult();               
        }

    return new EmptyResult();
    }

我已经检查过这个问题的其他一些帖子,但找不到解决方案.虽然有人暗示可能的解决方案,但我对微软CDN(http://www.asp.net/ajaxlibrary/cdn.ashx)感到困惑.

在Microsoft CDN上,他们有以下部分:

以下ASP.NET MVC JavaScript文件托管在此CDN上:

ASP.NET MVC 5.0

http://ajax.aspnetcdn.com/ajax/mvc/5.0/jquery.validate.unobtrusive.js
http://ajax.aspnetcdn.com/ajax/mvc/5.0/jquery.validate.unobtrusive.min.js

ASP.NET MVC 4.0

http://ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.js
http://ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js

ASP.NET MVC 3.0

http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.js
http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.min.js
http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.js
http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js
http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.js
http://ajax.aspnetcdn.com/ajax/mvc/3.0/MicrosoftMvcAjax.debug.js 

ASP.NET MVC 2.0

http://ajax.aspnetcdn.com/ajax/mvc/2.0/MicrosoftMvcAjax.js
http://ajax.aspnetcdn.com/ajax/mvc/2.0/MicrosoftMvcAjax.debug.js 

ASP.NET MVC 1.0

http://ajax.aspnetcdn.com/ajax/mvc/1.0/MicrosoftMvcAjax.js
http://ajax.aspnetcdn.com/ajax/mvc/1.0/MicrosoftMvcAjax.debug.js 

他们似乎建议你对MVC5唯一需要的脚本是jquery.validate.unobtrusive.

Answer 1

要获取本地副本作为MVC项目的一部分"从VS2013,右键单击您的MVC 5项目,选择"管理NuGet包".选择"在线"并搜索"jquery.unobtrusive-ajax",然后安装"Microsoft. jQuery.Unobtrusive.Ajax".

Answer 2

我在虚拟MVC5项目上遇到了同样的问题.

将其添加到BundleConfig

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

将其添加到layout.cshtml中

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

我没有向我的项目添加任何新文件,所以如果你有一个MVC 4或5 web项目,我怀疑你是否需要添加任何额外的js文件.

它解决了我的问题.我希望它能解决你的问题.

Answer 3

由于我在布局中包含以下脚本,所以一切都已开始工作:

<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.min.js"></script>

在Microsoft CDN上,它看起来好像这个脚本是特定于MVC3的.

如果可能的话,请随意提供更好的方法,或回答问题:"为什么这个脚本不包含在MVC项目模板(VS2013)中？"