Question

我在视图中有一个表单（编辑视图），在编辑视图中有该表单内的部分视图。部分视图具有自己的执行查找的形式。部分视图中的查找成功将结果返回到“编辑”视图。但是，部分视图中的POST第二次命中控制器（尝试在“编辑”视图中提交表单）。如何阻止POST再次敲击控制器？

这是在编辑视图中调用局部视图的地方：

<div class="form-group" id="search-pac">
    @Html.Action("PacSearch", "ItemRequest");
</div>
<div class="form-group" id="search-pac-results">
</div>

这是控制器获取局部视图的地方：

[HttpGet]
public ActionResult PacSearch()
{
    return PartialView("_PacSearchFormPartial");
}

以下是局部视图中的表单：

@using (Ajax.BeginForm("PacSearch", "ItemRequest", FormMethod.Post,
    new AjaxOptions
    {
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "POST",
        UpdateTargetId = "search-pac-results"
    }))
{
    <div>
        @Html.TextBox("pacupc")
        <input type="submit" value="Find PAC" />
    </div>      
}

然后点击控制器：

[HttpPost]
public ActionResult PacSearch(string pacupc)
{  
    //do lookup stuff, and call a partial view to display the results
}

一旦结果显示在编辑视图上，POST就会在这里点击控制器（我不想要，除非点击编辑视图中的提交按钮）：

[HttpPost]
public ActionResult Edit(ItemRequest itemRequest, HttpPostedFileBase upcImage, Comment comment, String FinalApproval)
{  
    //handle form submission from Edit View
}

如何保持部分视图中的POST不会触及控制器中的HttpPost for Edit视图？

更新根据建议使用直接的AJAX调用，我抛弃了部分视图并将我的编辑视图更改为：

                            <div class="form-group" id="search-pac">
                                @Html.TextBox("pacupc")
                                <input type="button" id="btn-pacupc" value="Find PAC" />
                              @*  @Html.Action("PacSearch", "ItemRequest");*@
                            </div>
                            <div class="form-group" id="search-pac-results">
                            </div>

和AJAX通话：

    <script type="text/javascript">
        $(document).ready(function () {
            $(document).on('click', '#btn-pacupc', function () {
                var pacupc = $("#pacupc").val();
                $.ajax({
                    type: "POST",
                    url: "@Url.Action("PacSearch")",
                    data: { pacupc: pacupc },
                    success: function (result) { $('#search-pac-results').html(result); }
                });
            });
        });
</script>

Answer 1

HTML中的表单中不支持表单。最里面的表单内的提交也将提交任何父表单。然后，解决方案是不依赖Ajax.BeginForm，它会将一个表单元素打印到页面，而是手动连接您的AJAX。这是为什么我鼓励每个人不使用Ajax助手家族的一个主要例子。它们只是太多，对开发人员来说是隐藏的，并且当事情不按预期工作时常常会导致混淆，这种情况经常发生。

从局部视图POST是两次击中控制器

1 个答案: