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