我有一个与用户关联的项目列表。这是一对多的关系。我希望将整个项目列表传递到视图中,以便他们可以从尚未与之关联的项目中进行选择(并且还可以查看已经关联的项目)。我想从这些创建复选框。然后我想将所选择的那些发送回控制器以进行关联。我如何传递所有这些列表,包括那些尚未关联的列表,并可靠地将它们传回以进行关联?
这是我首先尝试的内容,但很明显这不起作用,因为我基于通过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>
答案 0 :(得分:20)
您无法使用foreach
循环绑定到集合。你也不应该手动生成你的html,在这种情况下不会有效,因为未选中的复选框不会回发。始终使用强类型的html帮助程序,以便获得正确的双向模型绑定。
您尚未说明您的模型,但假设您有User
并希望为该用户选择Roles
,则创建视图模型以表示您要在视图中显示的内容< / p>
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方法中,您的模型将被绑定,您可以检查已选择的角色
[HttpPost]
public ActionResult Edit(UserVM model)
{
// Loop through model.Roles and check the IsSelected property
}
答案 1 :(得分:0)
您似乎不会动态删除复选框,这样可以更轻松地解决此问题。注意:如果允许客户端或脚本动态删除页面中的复选框,则以下解决方案无法按预期工作,因为索引将不再是顺序的。
MVC模型绑定并非万无一失,所以有时你必须帮助它。模型绑定器知道它需要绑定到名为Items的属性,因为输入字段的名称是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的属性,并将此值绑定到i处的项目索引。