将checkbox列表传入视图并将IENumerable拉出

我有一个将与用户关联的项目列表。 这是一对多的关系。 我想要传递到视图中的项目的整个列表,以便他们可以select那些还没有关联到他们(也看到那些已经关联)。 我想从这些创buildcheckbox。 然后我想把选定的那个发送回控制器来关联。 我怎么能通过所有这些列表,包括那些还没有关联的列表,并且可靠地将它们传回来关联?

这是我第一次尝试,但很明显,这不会工作,因为我将input的项目通过AllItems集合传入的项目,这些项目与用户本身的项目没有连接。

 <div id="item-list"> @foreach (var item in Model.AllItems) { <div class="ui field"> <div class="ui toggle checkbox"> <input type="checkbox" id="item-@item.ItemID" name="Items" value="@item.Active" /> <label for="item-@item.ItemID">@item.ItemName</label> </div> </div> } </div> 

你不能使用foreach循环绑定到一个集合。 也不应该手动生成您的HTML,在这种情况下,将无法正常工作,因为未经检查的checkbox不会回发。 始终使用强types的HTML帮助程序,以便获得正确的双向模型绑定。

你没有指出你的模型是什么,但是假设你有一个User并且想为那个用户selectRoles ,那么创build视图模型来表示你想在视图中显示的内容

 public class RoleVM { public int ID { get; set; } public string Name { get; set; } public bool IsSelected { get; set; } } public class UserVM { public UserVM() { Roles = new List<RoleVM>(); } public int ID { get; set; } public string Name { get; set; } public List<RoleVM> Roles { get; set; } } 

在GET方法中

 public ActionResult Edit(int ID) { UserVM model = new UserVM(); // Get you User based on the ID and map properties to the view model // including populating the Roles and setting their IsSelect property // based on existing roles return View(model); } 

视图

 @model UserVM @using(Html.BeginForm()) { @Html.HiddenFor(m => m.ID) @Html.DisplayFor(m => m.Name) for(int i = 0; i < Model.Roles.Count; i++) { @Html.HiddenFor(m => m.Roles[i].ID) @Html.CheckBoxFor(m => m.Roles[i].IsSelected) @Html.LabelFor(m => m.Roles[i].IsSelected, Model.Roles[i].Name) } <input type"submit" /> } 

然后在post方法中,你的模型将被绑定,你可以检查哪些angular色被选中

 [HttpPost] public ActionResult Edit(UserVM model) { // Loop through model.Roles and check the IsSelected property } 

它看起来不像是要dynamic地删除checkbox,这使得这个问题更容易解决。 注意:如果允许客户端或脚本从页面dynamic删除checkbox,则以下解决scheme将无法按预期工作,因为索引将不再是顺序的。

MVC模型绑定不是万无一失的,所以有时你必须帮助它。 模型联编程序知道它需要绑定到名为Items的属性,因为input字段的名称是Items,但它不知道Items是一个列表。 所以假设在你的控制器中你有一个项目列表模型绑定到被调用的项目你需要做的是帮助MVC认识到你绑定到一个列表。 为此,请指定列表和索引的名称。

 <div id="item-list"> @for (var i = 0; i < Model.AllItems.Count; i++) { <div class="ui field"> <div class="ui toggle checkbox"> <input type="checkbox" id="item-@Model.AllItems[i].ItemID" name="Items[@i]" value="@Model.AllItems[i].Active" /> <label for="item-@Model.AllItems[i].ItemID">@Model.AllItems[i].ItemName</label> </div> </div> } </div> 

这里的关键是这样的:

<input type="checkbox" id="item-@Model.AllItems[i].ItemID" name="Items[@i]" value="@Model.AllItems[i].Active" />

注意项目[@i]? 这是告诉模型联编程序寻找一个名为Items的属性,并将此值绑定到我在Items中的索引。