Question

我尝试使用ajax提交表单，但表单会一直发布两次。一次使用FormCollection和输入，一次没有输入。我不确定我做错了什么。下面是我的表单，控制器方法和JavaScript。我想通过ajax提交表单，以便我可以使用JavaScript处理UI，我想尽可能使用FormCollection或类似的集合。请帮忙！

的JavaScript

$('#frmAddEdit').submit(function (e) {
    $('#alertFail').hide();

    var view = getUrlVars()["view"];
    var formData = $("#frmAddEdit").serialize();
    var token = $('input[name="__RequestVerificationToken"]', $("#frmAddEdit")).val();
    var formURL = $(this).attr('action');

    var isSubmitted = false;

    // ajax call to save data
    $.ajax({
        url: formURL,
        type: 'POST',
        dataType: 'json',
        data: { view: view, data: formData },
        success: function (response, status) {
            isSubmitted = response.data;
            if (isSubmitted == "true") {
                // switch the panels
                $('#pnlDetail').animate({ width: 'toggle' });
                $("#pnlGrid").delay(2000).animate({ width: 'toggle' });
                $('#alertSuccess').show();
                tblAdminGrid.ajax.reload();
            } else {
                $('#alertFail').show();
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            $('#alertFail').show(); //something went HORRIBLY wrong!
        }
    });

    e.preventDefault();
})

查看

<form method="post" action="/Admin/Edit?view=@Request.QueryString["view"].ToString()"        id="frmAddEdit" class="panel form-horizontal">
    @Html.AntiForgeryToken()

    <div class="panel-heading">
        <span class="panel-title capitalize">@ViewBag.Title</span>
    </div>
    <div class="panel-body">
        <input type="hidden" id="hdnId" name="hdnId" value="0"/>

        @if (Request.Params["view"] != null || ViewBag.View != null)
        {
            string currentView = Request.Params["view"] == null ? ViewBag.View.ToString() : Request.Params["view"].ToString();

            @Html.Partial("~/Views/Shared/_" + currentView + ".cshtml");
        }
    </div>
    <div class="panel-footer text-center-lg">
        <button class="btn btn-default cancel" type="button">Cancel</button>
        <button class="btn btn-primary submit" type="submit">Submit</button>
    </div>
</form>

控制器

public JsonResult Edit(string view, FormCollection data)
{
    return Json(new
    {
        data = isSuccessful
    },
    JsonRequestBehavior.AllowGet);
}

Answer 1

我认为您正在进行双重提交。

您的#frmAddEdit上有一个jquery选择器，但是按钮类型=＆＃34;提交＆＃34;在那个表格上。因此，当您按下该按钮时，它将触发您的jquery，并使用输入按钮提交您的表单。你应该有一个或另一个，而不是两者。

Answer 2

我认为该框架正在混淆GET / PUT请求。尝试添加属性：

[HttpPost]
public JsonResult Edit(string view, FormCollection data)
{
    return Json(new { data = isSuccessful });
}

asp .net mvc ajax submit不是覆盖表单的帖子

2 个答案: