Question

在视图中：

<form method="get" action="@Url.Action("Index")" data-atpl-ajax="true" data-atpl-target="#results">

    <div class="form-group">
            <label for="recipient-name" class="control-label">IP:</label>
                <input type="text" class="form-control" id="ClientIP" name="ClientIP">
        </div>
    <div class="form-group">
            <label for="recipient-name" class="control-label">Name:</label>
                <input type="text" class="form-control" id="Name" name="Name">
        </div>
    <button type="submit" class="btn btn-primary">Show Results</button>
</form>

JavaScript文件：

$(function () {
    var ajaxFormSubmit = function () {
        var $form = $(this);

        var options = {
            url: $form.attr("action"),
            type: $form.attr("method"),
            data: $form.serialize()
        };

        $.ajax(options).done(function (data) {
            var $target = $($form.attr("data-atpl-target"));
            $target.replaceWith(data);
        });

        return false;
    };

    $("form[data-atpl-ajax='true']").submit(ajaxFormSubmit);

});

我还确保了js文件的正确顺序：

<script type="text/javascript" src="~/Scripts/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>

但是，在控制器动作中，

Request.IsAjaxRequest()

返回false。这里的问题是什么？

Answer 1

正如其他人在评论中指出的那样，为了使Request.IsAjaxRequest()起作用，X-Requested-With标题必须存在于AJAX请求中。 jQuery应该自动添加它。环顾四周，我只发现了非常旧版本的jQuery的异常。如果您没有使用最新的1. *或2. *（取决于您对过去的IE版本支持的需要），您应该升级。

除此之外，您可以手动添加标题。这不是理想的，因为你几乎只是在讨论这个问题，但更糟糕的是，只需添加以下内容：

var options = {
    url: $form.attr("action"),
    type: $form.attr("method"),
    data: $form.serialize(),
    beforeSend: function(xhr) {
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
    }
};

Answer 2

我不知道如何，但使用Ajax.BeginForm（）为我工作。我已经摆脱了表单元素并实现了这个：

@using (Ajax.BeginForm(new AjaxOptions
                {
                    HttpMethod = "GET",
                    InsertionMode = InsertionMode.Replace,
                    UpdateTargetId = "results"
                }))
                {
                     //input fields go here
                }

有兴趣知道造成这种行为的原因。

Request.IsAjaxRequest（）为false

2 个答案: