MVC 5 如何在表单中提交 ajax 搜索答案

【问题标题】：MVC 5 How to submit an ajax search in a formMVC 5 如何在表单中提交 ajax 搜索
【发布时间】：2014-11-08 05:18:53
【问题描述】：

我正在尝试向表单添加搜索功能。它是一个填充了类别的多选列表框，选中后将导致底部的表格进行相应的过滤。结果，我有两种形式，顶部的一种是 ajax 搜索请求。对于实际需要发布时选择的类别，我在另一种形式中有一个 hiddenfor。问题是当我点击搜索时，两个表单都发布，它似乎没有记录表单在另一个表单之外的事实。我不知道如何让第一个表单成为获取请求，我以为我在选项中配置了它，但显然我遗漏了一些东西。

@using (Ajax.BeginForm(
    new AjaxOptions
    {
        HttpMethod = "get",
        InsertionMode = InsertionMode.Replace,
        UpdateTargetId = "vendorList"
    }))
{
    <div class="form-group col-sm-12">
        <div class="col-md-3">
            @Html.LabelFor(model => model.catIds, new { @class = "control-label col-md-2" })
        </div>
        <div class="col-sm-6">
            @Html.ListBoxFor(model => model.catIds, new MultiSelectList(Model.Categories, "Value", "Text", Model.catIds), new { @class = "chzn-select", data_placeholder = "Select  Categories..." })
            @Html.ValidationMessageFor(model => model.catIds)
            <input type="submit" value="Search" />

        </div>
    </div>
}

这是另一种形式...

@using (Html.BeginForm("Create", "item", FormMethod.Post, new { enctype = "multipart/form-data" }))
    {
        @Html.HiddenFor(model => model.catIds)

        @Html.AntiForgeryToken();

...attribute setting

                <div class="form-group col-sm-12" id="vendorList">
                    <div class="post-title" style="margin-top: 0em">
                        <h3 style="left:auto">Invite Vendors</h3>
                    </div>
                    <div class="col-sm-9">
                        <table class="table table-striped">
                            <thead>
                                <tr>
                                    <td>
                                        <button type="button" class="btn btn-default btn-xs" id="checkall">
                                            <span class="glyphicon glyphicon-ok"></span> Select All
                                        </button>
                                    </td>
                                    <td><b>VENDOR #</b></td>
                                    <td><b>VENDOR</b></td>
                                </tr>
                            </thead>
                            <tbody id="checkboxes">

                                @foreach (var item in Model.AllVendorUsers)
                                {
                                    <tr>
                                        <td>
                                            <input type="checkbox" name="InvitedVendors" value=@item.Id>
                                        </td>
                                        <td>
                                            @item.CompanyName
                                        </td>

                                        <td>
                                            @item.User.PhoneNumber
                                        </td>
                                    </tr>
                                }
                                <tr>
                                    <td>
                                        <button type="submit" id="btn_Create" class="btn pull-right" value="Create">Finish</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    }

【问题讨论】：

显示整个视图。
您需要哪些零件？我发布了另一个表格，唯一遗漏的是属性。一个附录是，当我不使用 ajax 时，表单会按预期工作。我知道我应该将回收的部分放在局部视图中，但现在我只需要让它工作，然后我会添加它。
看不到任何表明两个表单会同时回发的信息。在这两种方法中都设置一个断点，以确保这是实际发生的情况。第二种形式的@Html.HiddenFor(model => model.catIds) 没有意义，因为它的值将是页面首次加载时的初始值（除非您有一些 javascript 根据第一种形式中的选择更新它）
它们是两个单独的表单，当我删除 ajax 调用并使用 form(method="get") 它工作正常，但是当我尝试 ajax 它运行它们，并发布表单，而不是重用 get 方法来过滤表。使用断点只是告诉我表单正在发布。虽然它抛出了一个防伪令牌未找到错误。
预感我做了检查，第二个表单没有提交。正在发生的事情是第一个表单是发布，而不是运行获取。我为第二个表单填写了值，当我在控制器中使用断点时它们没有显示出来。虽然我在 ajax 表单中明确声明该方法是一个 get，但它以某种方式被覆盖并正在发布。

标签： ajax asp.net-mvc post model-view-controller get

【解决方案1】：

我修复了它，根据斯蒂芬关于检查包的建议（它在那里），我卸载了它，然后从 nuget 安装了一个新副本。现在它工作得很好，我不知道为什么它以前不能工作（过时或损坏？）。谢谢你的帮助斯蒂芬。

【讨论】：