什么'；这个jQuery表单帖子有什么问题？

我有一个表单，我正在尝试使用Ajax/提交它，而无需重新加载页面

Ajax调用正在命中服务器，但它似乎没有调用函数。我试过

$.post

和

$.ajax

。两者似乎都不起作用。几周前我做过一些非常类似的工作，但现在我无法复制它。（最终目标是将模型作为局部视图返回，以便查看验证。）

使用Firefox，控制器方法会立即被命中。使用Chrome，浏览器选项卡似乎锁定了。它有时会在延迟后击中控制器。（模型信息准确地传递过来。）

我做错了什么

我在这里有我的部分观点：

<% using (Ajax.BeginForm("CreateSimpleReport", "Main", new AjaxOptions { HttpMethod="POST" }, new { id="CreateSimpleReport" })){ %>
   <%: Html.ValidationSummary(false, "Report creation was unsuccessful. Please correct the errors and try again.", new { @class = "validation_summary" })%>
   <% Html.EnableClientValidation(); %>
   <div class="col">
<div class="row">
    <div class="label">
        <%: Html.LabelFor(m => m.Name)%>
    </div>
    <div class="field">
        <%: Html.TextBoxFor(m => m.Name, new { @class = "input texbox" })%>
        <%: Html.ValidationMessageFor(m => m.Name, "*")%>
    </div>
</div>
<div class="row">
    <div class="label">
        <%: Html.LabelFor(m => m.Description)%>
    </div>
    <div class="field">
        <%: Html.TextBoxFor(m => m.Description, new { @class = "input texbox" })%>
        <%: Html.ValidationMessageFor(m => m.Description, "*")%>
    </div>
</div>
<div class="row">
    <div class="label">
        <%: Html.LabelFor(m => m.Quantity)%>
    </div>
    <div class="field">
        <%: Html.TextBoxFor(m => m.Quantity, new { @class = "input texbox" })%>
        <%: Html.ValidationMessageFor(m => m.Quantity, "*")%>
    </div>
</div>
<div class="right"><input type="submit" class="button" value="Create Report" /></div>
</div>
<% } %>

最后，jQuery：

        $('#CreateSimpleReport').on('submit', function (e) {
            var $this = $(this);
            $.post((this), (this), function(data) {
                alert('finish');
            });
//            $.ajax({
//                type: 'POST',
//                url: (this),
//                data: (this),
//                success: function () {
//                    alert('success');
//                },
//                error: function (jqXHR, textStatus, errorThrown) {
//                    alert('error');
//                }
//            }); // end ajax call
        });

这（并非双关语）毫无意义。不能在参数也是DOM元素的情况下发布到DOM元素。除此之外，您还需要

e.preventDefault（）

（或

返回false；

）以避免定期提交表单。因此，当您的回调启动时，页面已经被重新加载

---

通过AJAX提交表单的最简单方法是使用。

您已经在使用

AJAX。BeginForm

，为什么需要jQuery脚本来执行AJAX

---

您是否包含了

jquery.unobtrusive ajax.js

？

您不应该将

ajax.

助手与

jquery.ajax

混合使用。如果您使用Ajax.BeginForm助手，那么只需包含

jquery.unobtrusive Ajax.js

脚本（ASP.NET MVC 3）或

MicrosoftAjax.js

和

MicrosoftMvcAjax.js

脚本（ASP.NET MVC 2），并订阅

AjaxOptions

中的成功回调

如果您决定手动使用jQuery.ajax，请使用标准的Html.ajax：

<% using (Html.BeginForm("CreateSimpleReport", "Main", FormMethod.Post, new { id = "CreateSimpleReport" })) { %>

---

关于将microsoft ajax和验证与自定义jquery ajax混合，我在这里有一个类似的思路：

---

仅使用Ajax.beginnform即可重新加载页面。这对我来说也没有意义，但我以前使用过它（我在一个示例中看到过），并且模型具有正确的值。无论如何，您都应该更改它。可能远离这个例子（听起来有点像你在w3schools.com上找到的东西），有什么原因可以让它切换到新的页面，并将结果作为内容吗？我的回答是错误的……不知道。一个可能的原因是页面上的javascript错误，它阻止脚本执行并到达返回错误行。

$.post((this), (this)

<% using (Html.BeginForm("CreateSimpleReport", "Main", FormMethod.Post, new { id = "CreateSimpleReport" })) { %>

$(function() {
    $('#CreateSimpleReport').on('submit', function() {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {
                alert('AJAX success');
            }
        });

        // make sure you return false to cancel the default event
        return false;
    });
});