C# 如何在表之间交换行后正确地重新排列ID（jQuery和ASP.NET MVC4）

这里有一个视图模型，它有两个列表对象。我将在视图中将它们显示为两个表。我已经为他们创建了编辑器。我将为exchange操作放置四个按钮（向右移动一个、向右移动全部、向左移动一个、向左移动全部）。我在谷歌搜索了所有地方，但没有目标说明如何实现这一点，因为我需要移动整个对象，替换所有“name”和“id”标记，重新排序索引等等，因为这样我的列表才能正确发布。我也在使用Datatables.net和jQuery

有人知道怎么做吗？ 先谢谢你。代码如下

编辑 由于ASP.NET MVC上的列表元素的索引类似于“ListName\u 0\u Code”（用于Id）和“ListName[0].Code”（用于名称），如何正确地重新排列这些索引

EditorFor

@model ViewModels.UserPermissionDetails

<tr id="@Model.Id">
    <td>
        @Html.HiddenFor(m => m.Code)
        @Html.HiddenFor(m => m.Login)
        @Html.HiddenFor(m => m.Name)
        @Html.HiddenFor(m => m.IdEmpUser)
        @Html.DisplayFor(m => m.Code)
    </td>
    <td>@Html.DisplayFor(m => m.Login)</td>
    <td>@Html.DisplayFor(m => m.Nome)</td>
</tr>

---

只有在提交表单之前，才可以使用索引计算和设置

name

值，而不是针对每个移动操作

@Html.HiddenFor(m => m.Code, new { @class = "code" } })
// same for all the inputs you send to server


$("button[type='submit']").on("click", function (e) {
    e.preventDefault();

    updateIndexes();
    $("form").submit();
});

function updateIndexes() {
    $("#tbAllow").find("tbody").children("tr").each(function (i) {
        var prefix = "BlockList[" + i + "].";
        var $tr = $(this);

        $tr.find("input.code").attr("name", prefix + "Code");
        $tr.find("input.login").attr("name", prefix + "Login");
        // same for all the inputs you send to server
    });
};

---

感谢您回答@RaraituL。我试试这个。因此，如果我尝试这种方式，我就不需要为每次移动更新这些id和名称（将“BlockList”替换为“AllowList”）？不，您不必这样做。此外，请确保正确创建索引（索引必须从

tblAllow

和

tblBlock

上的0开始，它需要从

tblAllow

上最后一个项目所在的索引继续。此外，要将其映射回

MVC

，您只需要

name

属性，而不需要

id

，谢谢@raraaitul。我做了一些调整，现在每个事情是这样的。

function addElement(OriginTableId, DestinyTableId, OriginListName, DestinyListName) {
    var originTb = $(OriginTableId).DataTable(); //initialize DataTable.Net for origin table
    var destinyTb = $(DestinyTableId).DataTable(); //initialize DataTable.Net for destiny table
    var objectLine = $('#' + originTb.$('tr.selected').attr('id')); //get selected line that will be moved

    //Name replacing code piece
    var elementsFromLine = $(objectLine.children()[0]).children().toArray();
    elementsFromLine.forEach(function (item, index, array) {
        $(item).attr('id', $(item).attr('id').replace(OriginListName, DestinyListName)); //Replace 'OriginListName_0' with 'DestinyListName_0'
        $(item).attr('name', $(item).attr('name').replace(OriginListName, DestinyListName)); //Replace 'OriginListName[0]' with 'DestinyListName[0]'
    });

    //Reordering code piece here, how to?

    $(DestinyTableId + ' tbody').append(objectLine.clone(true, true));
    objectLine.parent().remove();
}

@Html.HiddenFor(m => m.Code, new { @class = "code" } })
// same for all the inputs you send to server


$("button[type='submit']").on("click", function (e) {
    e.preventDefault();

    updateIndexes();
    $("form").submit();
});

function updateIndexes() {
    $("#tbAllow").find("tbody").children("tr").each(function (i) {
        var prefix = "BlockList[" + i + "].";
        var $tr = $(this);

        $tr.find("input.code").attr("name", prefix + "Code");
        $tr.find("input.login").attr("name", prefix + "Login");
        // same for all the inputs you send to server
    });
};