partalview中的MVC AJAX表单第一次发送到AJAX，第二次发送到完整的post

Question

我得到了一个问题，我第一次发布我的表单，它使用ajax和更新，但第二次它做了一个完整的帖子回来，并取代了我的部分视图的页面。我已经检查了我有UnobtrusiveJavaScriptEnabled = true，并在我不显眼的脚本上用on替换了live…仍然有同样的问题。

UPDATE:仅在ModelState无效时发生。

这是我已经找到一个答案，但仍然没有解决它的关闭:Ajax。BeginForm不能正常工作

我很感激你能为我做点什么。

这是我的主视图(Tester):

@{
ViewBag.Title = "testView";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>
    My TestView</h2>
    @{Html.RenderPartial("_Form", new Project.Models.TestModel());}
<div>
    @Html.ActionLink("Back to List", "Index")
</div>

这是我的部分视图表单(_Form):

@model Project.Models.TestModel
<div class="updatable">
<form method="post" action="@Url.Action("TestProjUpdate")" data-site-ajax="true" data-site-target=".updatable">
<fieldset>
    <div class="editor-label">
        @Html.LabelFor(model => model.TextField)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.TextField)
        @Html.ValidationMessageFor(model => model.TextField)
    </div>
    <p>
        <input type="submit" value="Create" />
    </p>
</fieldset>
</form>
</div>

这是我的控制器

public ActionResult Tester()
{
    return View();
}
[HttpPost]
public PartialViewResult TesterProjUpdate(TestModel model)
{
    if (!ModelState.IsValid)
        return PartialView("_Form", model);
    TestProj.Vehicle vehicle = new TestProj.Vehicle();
    if (Request.IsAjaxRequest())
    {
        return PartialView("_Vehicle", vehicle);
    }
    return PartialView("_Form", model);
}

最后是jQuery ajax调用:

$(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-site-target"));
        $target.replaceWith(data);
    });
    return false;
};
$("form[data-site-ajax='true']").submit(ajaxFormSubmit);

});

你能给我的任何帮助都会很棒的!

Answer 1

尝试更改

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

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

然后你的$target.replaceWith(data);添加

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