Ajax.BeginForm не запускает AJAX script, возвращается к обратной передаче

Я обновлю эту проблему с помощью решения, я хотел бы включить мою проблему и решение, поскольку я не смог найти ее в Stackoverflow. Если вы хотите перейти с помощью решения, не стесняйтесь.

У меня есть недавно созданный проект "Пустой" MVC5, созданный с использованием Visual Studio 2013. Мне было необходимо, чтобы по возможности было и нужно поведение AJAX. Использование Ajax.BeginForm всегда было прямым в MVC3, поэтому я думал, что это будет и в MVC5.

Однако ни одна из функций javascript, которые я указал в OnBegin, OnFailure или OnSuccess внутри AjaxOptions, не вызывается, когда я нажимаю кнопку отправки. Вместо этого сообщение Ajaxless отправляется на сервер, это показало, что это правда, рассматривая Request.IsAjaxRequest, который возвращает false.

Я пришел к выводу, что по какой-то причине 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();
    }

Я проверил несколько других сообщений по этой проблеме и не смог найти решение. Хотя некоторые намекали на возможное решение, я был смущен Microsoft CDN (http://www.asp.net/ajaxlibrary/cdn.ashx).

В Microsoft CDN они имеют следующий раздел:

В этом CDN размещены следующие файлы JavaScript ASP.NET MVC:

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 

Кажется, они предлагают только script, который вам понадобится для MVC5, это jquery.validate.unobtrusive.

Ответы

Ответ 1

Все началось, так как я включил в свой макет следующий script:

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

В Microsoft CDN это выглядит так, как будто этот script является MVC3.

Не стесняйтесь, если это возможно, внести более эффективные способы или ответить на вопрос: "Почему этот script не включен в шаблон проекта MVC (VS2013)?"

Ответ 2

Чтобы получить локальную копию как часть вашего проекта MVC "Из VS2013, щелкните правой кнопкой мыши по проекту MVC 5, выберите" Управление пакетами NuGet". Выберите "Интернет" и найдите "jquery.unobtrusive-ajax", Затем установите "Microsoft.jQuery.Unobtrusive.Ajax".

Ответ 3

У меня была такая же проблема с манекеном MVC5.

Добавьте это в свой BundleConfig

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

Добавьте это в свой layout.cshtml

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

Я не добавлял никаких новых файлов в свои проекты, поэтому, если у вас есть веб-проект MVC 4 или 5, я сомневаюсь, что вам нужно будет добавить дополнительные js файлы.

Это решило мою проблему. Надеюсь, он решает вашу проблему.

Ответ 4

У меня была такая же проблема, и на самом деле решение заключалось в том, чтобы ссылки script находились в правильном порядке (в частности, что @Scripts.Render("~/bundles/jquery") появляется перед @Scripts.Render("~/bundles/jqueryval"))

По какой-то причине это было не так по умолчанию при создании нового проекта и добавлении пакетов nuget

Ответ 5

Вы проверили, содержит ли ваш файл web.config

<appSettings>
    <!-- this one is for client side validation -->
    <add key="ClientValidationEnabled" value="true" />

    <!-- this is for unobtrusive ajax -->
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>