我目前正在实施一个家谱我的 ASP.NET MVC 项目中的系统。为了设置家庭成员之间的关系，我需要每行显示两个 ComboBox/DropDownList 来定义一个成员与另一个成员之间的关系。
首先我将分享我的代码，然后我将解释到目前为止我尝试过的方法以及最终的结果。
public class FamilyTreeRelationshipViewModel
{
[ScaffoldColumn(false)]
public string FromMemberId { get; set; }
[ScaffoldColumn(false)]
public string ToMemberId { get; set; }
public Member FromMember { get; set; }
public IEnumerable<Member> ToMembers { get; set; }
[UIHint("FTComboBox")]
[AdditionalMetadata("BindTo", "relationships")]
[Required]
[Display(Name = "From Relationship")]
public string FromRelationship { get; set; }
[UIHint("FTComboBox")]
[AdditionalMetadata("BindTo", "relationships")]
[Required]
[Display(Name = "To Relationship")]
public string ToRelationship { get; set; }
}
public class FamilyTreeController : Controller
{
private AppMVC db = new AppMVC();
public ActionResult Index(Guid? cid, Guid? mid)
{
if (cid == null && mid == null)
{
return new HttpStatusCodeResult(HttpStatusCode.NotFound);
}
var frommember = db.Member.FirstOrDefault(x => x.MemberId == mid && x.CaseId == cid && x.Deleted == false);
var tomembers = db.Member.Where(x => x.CaseId == cid && x.MemberId != mid.Value && x.Deleted == false).ToList();
ViewBag.cid = cid;
ViewBag.mid = mid;
PopulateRelationship();
var familyTreeRelationshipViewModel = new FamilyTreeRelationshipViewModel
{
FromMember = frommember,
ToMembers = tomembers,
};
return View(familyTreeRelationshipViewModel);
}
public void PopulateRelationship()
{
var relationship = db.RelationshipDD
.Where(c => c.Deleted == false && c.Code != "PA")
.OrderBy(c => c.OrderIndex)
.Select(c => new RelationshipDDViewModel
{
Code = c.Code,
Definition = c.Definition
})
.ToList();
ViewData["relationships"] = relationship;
}
}
@model object
@{
var bindto = ViewData.ModelMetadata.AdditionalValues["BindTo"].ToString();
var fieldname = ViewData.ModelMetadata.PropertyName;
var prefix = ViewData.TemplateInfo.HtmlFieldPrefix;
}
@(Html.Kendo().ComboBoxFor(m => m)
.Filter("contains")
.Placeholder(ViewData.ModelMetadata.DisplayName)
.DataTextField("Definition")
.DataValueField("Code")
.HtmlAttributes(new { style = "width: 100%", Id = prefix})
.BindTo((System.Collections.IEnumerable)ViewData[bindto])
)
@Html.ValidationMessageFor(m => m, "", new { @class = "mdc-text-red-400" })
为了向每一行显示一个新结果，我使用了foreach在视图中：
@if (Model.ToMembers != null)
{
if (Model.ToMembers.Any())
{
foreach (var othermembers in Model.ToMembers.OrderBy(x => x.MemberNumberSuffix))
{
@Html.EditorFor(m => m.ToRelationship)
@Html.EditorFor(m => m.FromRelationship)
}
}
}
As you see below in the screenshot, only ComboBoxes in the first row were rendered. I assume it's because of the same control Id for each ComboBox. I checked the browser developer tools (F12), all of them had the same Id.
后来我想我应该使用 For 而不是 Foreach ，看看会发生什么：
@if (Model.ToMembers != null)
{
if (Model.ToMembers.Any())
{
for (var i = 0; i < Model.ToMembers.Count(); i++)
{
var othermembers = Model.ToMembers.ToList()[i];
@Html.EditorFor(m => m.ToRelationship[i])
@Html.EditorFor(m => m.FromRelationship[i])
}
}
}
As you see below in the screenshot, all of the ComboBoxes are gone and everything has been rendered as Char. The only difference here is that each control/input has it's own Id and that's good but not good as I was expecting.
毕竟，我决定使用内置 DropDownList (MVC) 来实现此目的，并且结果相同。因为我认为 Telerik 控制有问题。
我什至尝试直接在视图中使用组合框而不是编辑者，结果不同了。每行都被单独渲染并成功，但它又是 Char 类型，甚至错误消息也这么说。通常应该说“来自关系字段是必需的”。
@if (Model.ToMembers != null)
{
if (Model.ToMembers.Any())
{
for (var i = 0; i < Model.ToMembers.Count(); i++)
{
@(Html.Kendo().ComboBoxFor(m => m.ToRelationship[i])
.Filter("contains")
.Placeholder(ViewData.ModelMetadata.DisplayName)
.DataTextField("Definition")
.DataValueField("Code")
.HtmlAttributes(new { style = "width: 100%" })
.BindTo((System.Collections.IEnumerable)ViewData["relationships"])
)
@(Html.Kendo().ComboBoxFor(m => m.FromRelationship[i])
.Filter("contains")
.Placeholder(ViewData.ModelMetadata.DisplayName)
.DataTextField("Definition")
.DataValueField("Code")
.HtmlAttributes(new { style = "width: 100%" })
.BindTo((System.Collections.IEnumerable)ViewData["relationships"])
)
}
}
}
Screenshot:
在此先感谢您的帮助！
首先，解释一下你的错误。您不能使用foreach循环生成form集合的控件。它会生成重复的name无法绑定回集合的属性（并且重复id无效的 html 属性）。你需要使用一个for循环，或者更好的自定义EditorTemplate。你的第二个错误（当你使用for循环）是因为您绑定的属性是string，因此绑定到m => m.ToRelationship[i]绑定到一个字符（typeofChar） 在里面string.
真正的问题是您的视图模型不正确，并且与视图中的显示/编辑内容无关，并且您需要将下拉列表绑定到集合中的属性。
此外，您使用 2 个组合框ToRelationship and FromRelationship会导致很多潜在的错误，你应该重新定义你的Relationship表包含（例如）以下字段
ID, Relationship, MaleReverseRelationship, FemaleReverseRelationship
所以典型的行可能包含
1, Son, Father, Mother
2, Wife, Husband, NULL
3, Niece, Uncle, Aunt
那么你需要一个下拉列表，如果杰克和罗杰的关系是Son，你知道相反的关系是Father（假设你的Member模型有一个字段Gender）。这将极大地简化您的视图模型，使 UI 更简单，并防止用户选择错误的反向关系时出现错误。
您尚未提供有关其他表格/模型的任何信息，但您需要MemberRelationShip带字段的表
ID, Member (FK to Members), OtherMember(FK to Members), RelationShip(FK to Relationships).
然后你需要 2 个视图模型，一个用于父视图模型Member以及建立关系的人
public class ParentMemberVM
{
public int ID { get; set; }
public string Name { get; set; }
.... other properties to display
public IEnumerable<MemberVM> Members { get; set; }
public IEnumerable<SelectListItem> RelationshipList { get; set; }
}
public class MemberVM
{
public int ID { get; set; }
public string Name { get; set; }
public int Relationship { get; set; }
}
那么你需要一个EditorTemplate for MemberVM
/Views/Shared/EditorTemplates/MemberVM.cshtml
@model MemberVM
@Html.HiddenFor(m => m.ID)
@Html.DisplayFor(m => m.Name)
@Html.DropDownListFor(m => m.Relationship, (IEnumerable<SelectListItem>)ViewData["relationships"])
并在主视图中
@model ParentMemberVM
....
@using (Html.BeginForm())
{
@Html.HiddenFor(m => m.ID)
@Html.DislayFor(m => m.Name)
@Html.EditorFor(m => m.Members, new { relationships = Model.RelationshipList })
<input type="submit" value="Save" />
}