2

aspnet Unobtrusive Ajax (js) ライブラリを利用して、単純な「ニュースレターの購読」フォームを実装しようとしています。

(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>

何が欠けていますか?

4

0 に答える 0