Ненавязчивая библиотека Ajax Не отправляет заголовок XmlHttpRequest - PullRequest
Новая
       30

Ненавязчивая библиотека Ajax Не отправляет заголовок XmlHttpRequest

0 голосов
/ 27 июня 2018

Мы пытаемся реализовать простую форму «подписаться на нашу рассылку» с помощью библиотеки unptrusive Ajax (js) aspnet.

Мы заметили (используя Fiddler), что на сервер не отправляется заголовок XmlHttpRequest.

Что мы можем сделать, чтобы решить? 

 <form class="row no-gutters justify-content-center"
                  asp-controller="Home" asp-action="SubscribeNewsLetter"
                  data-ajax="true"
                  data-ajax-method="POST"
                  data-ajax-mode="replace-with"
                  data-ajax-update="#updatethis"
                  data-ajax-loading="#loading"
                  data-ajax-success="Success" 
                  data-ajax-failure="Failure">

<div id="submitted" class="col-12 col-sm-6 col-md-5 col-lg-4 underline">
                    <input id="emailaddress" asp-for="@emailAddress" type="text" class="newsletter-input" placeholder="Insira o seu email">
                    <button class="btn btn-outline-dark newsletter-btn" type="submit"><i class="fa fa-long-arrow-right"></i></button>
                </div>
            </form>

Наш контроллер: 

[HttpPost]
public IActionResult SubscribeNewsLetter(string emailAddress, string returnUrl)
{
    if (!ModelState.IsValid)
    {
        return View();
    }

    if (Request.IsAjaxRequest())
    {
        return new ViewResult() { ViewName = "SubmitNewLetterSuccess" };
    }
    return null;
}

Расширение IsAjax: 

public static bool IsAjaxRequest(this HttpRequest request)
{
    if (request == null)
    {
        throw new ArgumentNullException("request");
    }

    if (request.Headers != null)
    {
        return request.Headers["X-Requested-With"] == "XMLHttpRequest";
    }
    return false;
}

Сценарии, которые мы включаем в страницу бритвы: 

<partial name="_ValidationScriptsPartial"/>
<script src="~/lib/jquery-ajax-unobtrusive/jquery.unobtrusive-ajax.js"></script>
<script> 
    function Success() {
        // do something on success client side.
        $('#emailaddress').val("");
    }
    function Failure() {
        alert("Could not submit your email address at this moment.");
    }
</script>

Чего нам не хватает?

1 Ответ

0 голосов
/ 02 июля 2018

Возможно, это объясняет именно то, как «почему» это работает или нет, но если вы используете бритвенные страницы (asp.net core 2+), этот репозиторий предоставляет рабочий пример: https://github.com/psijkof/RazorPagesAjax

...