从嵌套集合中添加/删除MVC4(使用jQuery?)

我在使用webforms很长一段时间后都在努力学习ASP.net MVC,所以如果我对这些东西感到困惑,那就道歉了。 我无法超越简单的每个模型编辑页面结构。 我有员工,他们被外包到项目中,我想在一个页面上编辑这一切。

我有一个员工模型:

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

这是我的ProjectXref模型:

 public class ProjectXref { public Project Project { get; set; } public string Role { get; set; } } 

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

 @model Relationships.Models.ProjectXref   @Model.Project.ProjectName   @Html.EditorFor(model => model.Role)  @Html.HiddenFor(model => model.Project.ProjectKey)     

…在我的员工编辑视图中,我只使用EditorFor为我的员工关联的每个项目呈现tr行。

 @Html.EditorFor(model => model.Projects) 

我现在不知道如何处理这些问题。 我开始用一些jQuery来删除我的ProjectXref:

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

看起来不错,但是如果我删除第一个项目然后提交,我的post中就不会出现以下任何项目。 我认为它与任何魔法绑定有关; 我的“Projects_0__Title”字段丢失,因此MVC会跳过尝试绑定其他任何内容。

我的目标:我想在我的页面上动态修改我的项目列表,这意味着能够删除项目,添加新项目或编辑项目(更改员工相对于项目的角色)。 我试图让MVC做到这一点我错了吗? 通过我看过的教程,大多数人都会编辑并添加新的ProjectXrefs,每个都有一个单独的页面,但这看起来像是糟糕的UI。

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

编辑:我的解决方案

感谢@Parv Sharma,我最终为我的class级创建了一个新的Property:

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

然后我将其添加到我的视图中作为隐藏:

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

然后我使用AngularJS(不得不学习一个)从我的字段中读取JSON并将其呈现在我的UI中。

我实现这一目标的方法是保留一个隐藏的字段,跟踪添加或删除的字段,并且是集合的一部分。
这样,无论何时删除集合中的元素,您只需要更新JSON,当它被回发时,请读取json并相应地更新集合
要序列化或反序列化JSON您可以使用内置的JavaScriptSerializernewtonsoft.json