MVC4添加/删除嵌套集合（使用jQuery？）

在使用webforms很长一段时间后，我正在尝试学习ASP.NETMVC，如果我把事情弄糊涂了，我深表歉意。我很难超越每个模型结构的简单编辑页面。我有员工，他们被外部参照到项目，我想在一个页面上编辑所有这些

我有一个员工模型：

public class Employee
{
    public string UserID { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public List<ProjectXref> Projects { get; set; }
}

我为ProjectXref创建了一个编辑器模板：

@model Relationships.Models.ProjectXref

<tr>
    <td><span class="h3"> @Model.Project.ProjectName </span> </td>
    <td>@Html.EditorFor(model => model.Role)</td>
    <td>
        @Html.HiddenFor(model => model.Project.ProjectKey)
        <a class="btnDel" > </a>
    </td>
</tr>

$(".btnDel").live("click", function () {
    $(this).parents('tr').remove();
    return false;
});

我现在正忙着怎么处理这些东西。我从一些jQuery开始删除我的ProjectXref：

@model Relationships.Models.ProjectXref

<tr>
    <td><span class="h3"> @Model.Project.ProjectName </span> </td>
    <td>@Html.EditorFor(model => model.Role)</td>
    <td>
        @Html.HiddenFor(model => model.Project.ProjectKey)
        <a class="btnDel" > </a>
    </td>
</tr>

$(".btnDel").live("click", function () {
    $(this).parents('tr').remove();
    return false;
});

这看起来不错，但是如果我删除了第一个项目，然后提交，那么我的帖子中就不会显示以下项目。我认为这与正在进行的魔法绑定有关；我的“Projects\u 0\u Title”字段丢失，因此MVC将跳过绑定其他内容的尝试

我的目标是： 我想在我的页面上动态修改我的项目列表，这意味着可以删除项目、添加新项目或编辑项目（更改员工相对于项目的角色）。我试图让MVC这么做是错的吗？在我看到的教程中，大多数教程都会让您编辑和添加新的项目外部参照，每个项目外部参照都有一个单独的页面，但这似乎是一个糟糕的UI

在我看来，我希望能够将新的ProjectXref编辑器HTML添加到表单中，并且在发布表单时，让ASP.net将其识别为新的ProjectXref并将其绑定。同时，如果我删除了与现有ProjectXref关联的字段，我希望ASP.net能够识别其中一个ProjectXref的字段现在已丢失，以便删除该ProjectXref。我使用EditorTemplates是否走错了路

编辑：我的解决方案

感谢@Parv Sharma，我最终为我的类创建了一个新属性：

public string ProjectsJson
{
    get { return JsonConvert.SerializeObject(Projects); }
    set { Projects = JsonConvert.DeserializeObject<List<ProjectXref>>(value); }
}

---

然后，我使用AngularJS（无论如何都必须学习一个）从我的字段中读取JSON并将其显示在我的UI中。

我实现这一点的方法是保留一个隐藏字段，该字段跟踪添加或删除的字段，并且是集合的一部分。
这样，每当删除集合中的元素时，只需更新JSON，当它被发回时，读取JSON并相应地更新集合

---

要序列化或反序列化

JSON

，您可以使用内置的

JavaScriptSerializer

或

newtonsoft.JSON

实现这一点的方法是保留一个隐藏字段，跟踪添加或删除的字段以及作为集合一部分的字段。
这样，每当删除集合中的元素时，只需更新JSON，当它被发回时，读取JSON并相应地更新集合
要序列化或反序列化

JSON

，可以使用内置的

JavaScriptSerializer

或

newtonsoft.JSON

@Html.HiddenFor(model => model.ProjectsJson)