当前项目：
我正在尝试使用模型中的OptGroups构建一个选择菜单，但我的问题是我似乎无法自己构建OptGroups。
我的模特：
[DisplayName("City")]
public string CityId { get; set; }
private IList<SelectListItem> _CityName;
public IList<SelectListItem> CityName {
get {
List<SelectListItem> list = new List<SelectListItem>();
Dictionary<Guid, SelectListGroup> groups = new Dictionary<Guid, SelectListGroup>();
List<Region> region = db.Region.Where(x => x.Active == true).OrderBy(x => x.RegionName).ToList();
foreach(Region item in region) {
groups.Add(item.RegionId, new SelectListGroup() { Name = item.RegionName });
}
List<City> city = db.City.Where(x => x.Active == true).ToList();
foreach(City item in city) {
list.Add(new SelectListItem() { Text = item.CityName, Value = item.CityId.ToString(), Group = groups[item.RegionId] });
}
return list;
}
set { _CityName = value; }
}
每个城市都可以在一个地区。我想要一个选择菜单按地区分组城市。通过我能想到的一切，上面的代码应该可以完成这项工作，但我得到一个下拉菜单，其中 所有城市 分组在名为{的OptGroup下{1}}
上面代码中的关键是我首先遍历Regions，并将它们放入一个Dictionary中，System.Web.Mvc.SelectListGroup设置为带回RegionId的键（它本身）格式化为SelectListGroup）。
然后我遍历城市，并为每个城市分配与城市RegionName匹配的组。
我没有在互联网上看到任何实际从数据库中提取内容的示例 - 所有示例中有100％使用硬编码的RegionId和SelectListGroup值。
我的观点也是正确的，AFAIK：
SelectListItem正如您所看到的，该群组应该被带入@Html.DropDownListFor(x => x.CityId, new SelectList(Model.CityName, "Value", "Text", "Group", 1), "« ‹ Select › »", htmlAttributes: new { @class = "form-control" })
，SelectList 正在使用DropDownList创建，而不是正确的。
我的结果下拉菜单如下所示：
OptGroups什么时候应该是这样的：
« ‹ Select › »
System.Web.Mvc.SelectListGroup
City1
City2
...
LastCity
建议？
修改后的解决方案：我已按照the solution提供的Stephen Muecke进行了操作，但稍作修改。
MVC的常规规则之一是您拥有一个比控制器更重的模型，并且该模型定义了您的业务逻辑。 Stephen声称所有数据库访问都应该在控制器中完成。我已同意两者。
我最大的“问题”之一是，每次调用页面时都需要调用任何下拉菜单或任何其他预先填充的表单元素的创建。这意味着，对于创建或编辑页面，您不仅需要在[HttpGet]方法上调用它，还需要在[HttpPost]方法中调用它，在该方法中模型被发送回视图，因为它没有正确验证。这意味着您必须将代码（传统上通过ViewBags）添加到每个方法，只是为了预先填充下拉列表等元素。这称为代码复制，并不是一件好事。必须有一个更好的方法，并且由于斯蒂芬的指导，我找到了一个。
将数据访问权限保留在模型之外的问题是您需要使用数据填充模型。避免代码重用和避免潜在错误的问题是您不应该将数据绑定到控制器中的元素。后一个操作是业务逻辑，并且正确地属于模型。我的业务逻辑是，我需要将用户输入限制为按地区分组的城市列表，管理员可以从下拉列表中进行选择。因此，虽然我们可能汇总控制器中的数据，但我们将绑定到模型中的模型。我之前的错误是在模型中做了两件事，这完全不合适。
通过将数据绑定到模型中的模型，我们避免必须将其绑定两次 - 一次在控制器的[HttpGet]和[HttpPost]方法中。我们只需要在由两种方法处理的模型中绑定一次。如果我们有一个可以在Create和Edit函数之间共享的更通用的模型，我们只能在一个地方而不是四个地方进行这种绑定（但我没有这种程度的通用性，所以我不会这样做一个例子）
首先，我们实际上剥离了整个数据组件，并将其粘贴在自己的类中：
« ‹ Select › »
Region1
City2
City4
City5
Region2
City3
City1
City6
这存在于命名空间内，但在我们正在处理的部分的控制器下面。为了清楚起见，我把它放在文件的最末端，就在关闭命名空间之前。
然后我们看一下这个页面的模型：
public class SelectLists {
public static IEnumerable<SelectListItem> CityNameList() {
ApplicationDbContext db = new ApplicationDbContext();
List<City> items = db.City.Where(x => x.Active == true).OrderBy(x => x.Region.RegionName).ThenBy(x => x.CityName).ToList();
return new SelectList(items, "CityId", "CityName", "Region.RegionName", 1);
}
}
注意：即使public string CityId { get; set; }
private IEnumerable<SelectListItem> _CityName;
public IEnumerable<SelectListItem> CityName {
get { return SelectLists.CityNameList(); }
set { _CityName = value; }
}
是CityId且数据库字段是Guid，我也会通过视图将此值作为字符串引入，因为客户端验证很糟糕Guids的驴球。如果将uniqueidentifier作为字符串而不是Guid处理，则在下拉菜单上进行客户端验证要容易得多。您只需将其转换回Guid，然后再将其重新插入该表的主模型中。另外，CityName不是City表中的实际字段 - 它纯粹作为下拉菜单本身的占位符存在，这就是为什么它存在于创建页面的Value中。这样，在视图中我们可以创建一个CreateClientViewModel，明确地将CityId绑定到下拉菜单，实际上首先允许客户端验证（Guids只是一个令人头疼的问题）。
关键是DropDownListFor。正如您所看到的，没有更多的代码可以进行数据库访问，只需要一个简单的get {}来定位类，并调用方法SelectLists。您甚至可以将变量传递给方法，因此您可以使用相同的方法返回同一下拉菜单的不同变体。比如，如果您希望在一个页面上创建一个下拉列表（创建）以使其选项按OptGroups分组，而另一个下拉列表（编辑）则不需要任何选项分组。
实际模型最终比以前更简单：
CityNameList()无需修改带有下拉列表数据的元素 - 您只需通过@Html.DropDownListFor(x => x.CityId, Model.CityName, "« ‹ Select › »", htmlAttributes: new { @class = "form-control" })
调用它。
我希望这会有所帮助。
答案 0 :(得分：15)
首先，您查看模型不应包含数据库访问代码以填充其属性。这是控制器的责任，你已经使你的代码无法进行单元测试。首先将模型更改为
public class CreateClientViewModel
{
[DisplayName("City")]
public string CityId { get; set; }
public IList<SelectListItem> CityList { get; set; }
....
}
然后在控制器中，您可以使用SelectList的一个重载来接受groupName来生成集合
var cities = var cities = db.City.Include(x => x.Region).Where(x => x.Active == true)
.OrderBy(x => x.Region.RegionName).ThenBy(x => x.CityName);
var model = new CreateClientViewModel()
{
CityList = new SelectList(cities, "CityId", "CityName", "Region.RegionName", null, null)
};
return View(model);
在视图中
@Html.DropDownListFor(x => x.CityId, Model.CityList , "« ‹ Select › »", new { @class = "form-control" })
作为替代方案，您也可以使用Group
SelectListItem属性执行此操作
var model = new CreateClientViewModel()
{
CityList = new List<SelectListItem> // or initialize this in the constructor
};
var cities = var cities = db.City.Include(x => x.Region).Where(x => x.Active == true).GroupBy(x => x.Region.RegionName);
foreach(var regionGroup in cities)
{
var optionGroup = new SelectListGroup() { Name = regionGroup.Key };
foreach(var city in regionGroup)
{
model.CityList.Add(new SelectListItem() { Value = city.CityId.ToString(), Text = city.CityName, Group = optionGroup });
}
}
return View(model);
答案 1 :(得分：0)
我使用了这个出色的库：DropDownList Optgroup MVC 1.0.0
这是如何使用它：
准备好您的清单：
var ethnicityData = new List<GroupedSelectListItem> {
new GroupedSelectListItem() { Value="British", Text ="British", GroupName = "White", GroupKey="1"},
new GroupedSelectListItem() { Value="Irish", Text ="Irish", GroupName = "White", GroupKey="1"},
new GroupedSelectListItem() { Value="White Other", Text ="White Other", GroupName = "White", GroupKey="1"},
new GroupedSelectListItem() { Value="Other Ethin Group", Text ="Other Ethin Group", GroupName = "Other Ethnic Group", GroupKey="2"},
new GroupedSelectListItem() { Value="Chinese", Text ="Chinese", GroupName = "Other Ethnic Group", GroupKey="2"},
new GroupedSelectListItem() { Value="Other mixed background", Text ="Other mixed background", GroupName = "Mixed", GroupKey="4"},
new GroupedSelectListItem() { Value="White and Asian", Text ="White and Asian", GroupName = "Mixed", GroupKey="4"},
new GroupedSelectListItem() { Value="White and Black African", Text ="White and Black African", GroupName = "Mixed", GroupKey="4"},
new GroupedSelectListItem() { Value="White and Black Caribbean", Text ="White and Black Caribbean", GroupName = "Mixed", GroupKey="4"},
new GroupedSelectListItem() { Value="Other Black background", Text ="Other Black background", GroupName = "Black or Black British", GroupKey="5"},
new GroupedSelectListItem() { Value="Caribbean", Text ="Caribbean", GroupName = "Black or Black British", GroupKey="5"},
new GroupedSelectListItem() { Value="African", Text ="African", GroupName = "Black or Black British", GroupKey="5"},
new GroupedSelectListItem() { Value="Bangladeshi", Text ="Bangladeshi", GroupName = "Asian or Asian British", GroupKey="6"},
new GroupedSelectListItem() { Value="Other Asian background", Text ="Other Asian background", GroupName = "Asian or Asian British", GroupKey="6"},
new GroupedSelectListItem() { Value="Indian", Text ="Indian", GroupName = "Asian or Asian British", GroupKey="6"},
new GroupedSelectListItem() { Value="Pakistani", Text ="Pakistani", GroupName = "Asian or Asian British", GroupKey="6"},
new GroupedSelectListItem() { Value="Not Stated", Text ="Not Stated", GroupName = "Not Stated", GroupKey="3"}
};
像这样使用：
@ Html.DropDownGroupListFor（model =＆gt; model.Ethnicity，ethnicityData，＆＃34;＆＃34;，new {@class =＆＃34; form-control＆＃34;}）