尝试将表行作为List<>发布回MVC控制器。宾语

时间:2015-08-17 20:09:56

标签: javascript asp.net-mvc

对于我们的网站,我们有一个管理部分和一个用户部分。我们希望允许管理员指定在用户部分中向用户列出哪些订单商品。

我有一个MVC列表表,我已经启用了对行进行排序以实际更改排序值。但我正在尝试将排序保存到数据库中。正如您在下面看到的,我隐藏了某些属性的元素,并且我的javascript正确设置了HiddenFor(item.SortOrder)。然后它调用控制器。但是我想将整个行集合作为List<>传回来。宾语。有什么好例子吗?

@model System.Collections.Generic.IList<PublicationSystem.Model.CustomField>
<table class="table sortable-table"
data-source-href='@Url.RouteUrl("Default",
    new { action = "_CustomFieldSort" },
    Request.Url.Scheme)'>
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model[0].ColumnName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model[0].ColumnCaption)
            </th>
            <th></th>
        </tr>
    </thead>

    @for (var i=0; i < Model.Count; i++) //each (var item in Model)
    {
        <tr>
            <td>
                @Html.HiddenFor(modelItem => Model[i].CustomFieldId,new {name="fieldsToEdit["+i+"].CustomFieldId"})
                @Html.HiddenFor(modelItem => Model[i].CustomFormId, new { name = "fieldsToEdit[" + i + "].CustomFormId" })
                @Html.HiddenFor(modelItem => Model[i].SortOrder, new { name = "fieldsToEdit[" + i + "].SortOrder", @class = "SortOrder" })
                @Html.DisplayFor(modelItem => Model[i].ColumnName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => Model[i].ColumnCaption)
            </td>
            <td>
                ... buttons
            </td>
        </tr>
    }
</table>

我的javascript:

$(".sortable-table tbody").sortable({
    stop: function (event, ui) {

        $(".sortable-table tr").each(function (index, element) {
            var hiddenInput = $(element).find(".SortOrder").first();
            hiddenInput.val(index);
        });
        $.ajax({
            url: $(".sortable-table").attr("data-source-href"),
            method: "POST",
            data: $(".sortable-table").serialize(),
            success: function (result) {
                ClearAndRefresh(); // Assumes parent has this function
            }
        });
    }
});

我的控制器方法:

public ActionResult _CustomFieldSort(List<CustomField> fieldsToEdit)
{
    if (fieldsToEdit != null) // fieldsToEdit is always null after the sort
    {
        var fieldCount = fieldsToEdit.Count();
    }

    return null;// PartialView();
}

我的javascript正确地尝试对我的控制器方法进行ajax调用,但'fieldsToEdit'为空。我做错了什么?

1 个答案:

答案 0 :(得分:1)

批量更新?使用for循环将使您能够将整个列表映射回控制器上的post / get方法

@model System.Collections.Generic.IList<PublicationSystem.Model.CustomField>
<table class="table sortable-table">
<thead>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.ColumnName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.ColumnCaption)
        </th>
        <th></th>
    </tr>
</thead>

@for (int i=0; i < Model.Length;i++)
{
    <tr>
        <td>
            @Html.HiddenFor(modelItem => Model[i].CustomFieldId,new {name="fieldsToEdit["+i+"].CustomFieldId")
            @Html.HiddenFor(modelItem =>Model[i].CustomFormId,new {name="fieldsToEdit["+i+"].CustomFormId")
            @Html.HiddenFor(modelItem => Model[i].SortOrder, new { @class = "SortOrder",name="fieldsToEdit["+i+"].SortOrder" })
            @Html.DisplayFor(modelItem => Model[i].ColumnName,new {name="fieldsToEdit["+i+"].ColumnName")
        </td>
        <td>
            @Html.DisplayFor(modelItem => Model[i].ColumnCaption,new {name="fieldsToEdit["+i+"].ColumnCaption")
        </td>
        <td>
            ... buttons
        </td>
    </tr>
}

然后点击按钮发布按钮将批量更新整个列表,我不确定我是否正确回答你的问题。