如何在ASP.NET MVC 3中为填充的下拉列表创建视图模型

我正在尝试自学MVC3。 我是从webforms转换而来的。

我需要创建一个视图模型，其中包含一个下拉列表，我可以将其传递给控制器​​并最终在视图中呈现。

我怎么能做到这一点？ 我有骨架，但我不知道实际为视图创建名称值对的代码是什么。

namespace DH.ViewModels { public class SharedLayoutViewModel { public IEnumerable Products { //some code to setup the value/name pairs to be rendered in the view. //example: //Mustard //Ketchup //Mayo //Relish //BBQ } } } 

谢谢

Answer 1

我将在我的主视图模型中为Product创建一个类并创建Products属性，该类型为List

 public class ProductViewModel { public int ID { set;get;} public string Name { set;get;} } public class OrderViewModel { public int OrderNumber { set;get;} public List Products { set;get;} public int SelectedProductId { set;get;} } 

并在您的Controller Action方法中

 public ActionResult Order() { var orderVM=new OrderViewModel(); //Items hard coded for demo. You may replace with values from your db orderVM.Products= new List { new ProductViewModel{ ID=1, Name="IPhone" }, new ProductViewModel{ ID=2, Name="MacBook Pro" }, new ProductViewModel{ ID=3, Name="iPod" } }; return View(orderVM); } 

并在您的视图中强烈键入OrderViewModel。

 @model ORderViewModel @using (Html.BeginForm()) { 
 @Html.DropDownListFor(x => x.SelectedProductId , new SelectList(Model.Products, "ID", "Name"), "-- Select Product--") 
  } 

我还添加了一个SelectedProductId属性，因此当用户将表单发布回控制器时，您将从该属性的下拉列表中获取用户选择的值。

您还可以使用通用SelectListItem类型集合作为视图模型属性来传输下拉数据，而不是自定义ProductViewModel集合。

 public class OrderViewModel { public int OrderNumber { set;get;} public List Products { set;get;} public int SelectedProductId { set;get;} } 

在GET行动中，

 public ActionResult Order() { var orderVM=new OrderViewModel(); //Items hard coded for demo. You may replace with values from your db orderVM.Products= new List { new SelectListItem {Value = "1", Text = "IPhone"}, new SelectListItem {Value = "2", Text = "MacBook"}, new SelectListItem {Value = "3", Text = "Candy"} }; return View(orderVM); } 

在你看来，

 @Html.DropDownListFor(x => x.SelectedProductId, Model.Products, "-- Select Product--") 

编辑：根据OP的请求，编辑答案，让属性返回静态项目作为产品

我在Products属性中添加了一个get实现，以返回静态产品列表。

 public class OrderViewModel { private List _products; public int OrderNumber { set; get; } public List Products { get { if (_products == null) { _products = new List(); _products.Add(new ProductViewModel { ID = 1, Name = "Ketchup" }); _products.Add(new ProductViewModel { ID = 1, Name = "Mustard" }); _products.Add(new ProductViewModel { ID = 1, Name = "Relish" }); _products.Add(new ProductViewModel { ID = 1, Name = "Mayo" }); } return _products; } } public int SelectedProductId { set;get;} } 

现在在您的控制器中，您不需要调用GetAvailableProducts方法，因为它已经在那里。 所以控制器看起来像这样。

  public ActionResult Order() { OrderViewModel orderVM = new OrderViewModel(); return View(orderVM); } 

这是输出。

如果产品中有许多项目，请将其移至方法并调用该方法，以获得实现，而不是在那里编写。 这是更清洁的方法。

Answer 2

我更喜欢这样做。

 @Html.DropDownListFor(m => m.ProductId, new SelectList(Model.Products, "ID", "Name")) 

所以我的视图模型只包含一个产品列表，并在视图上生成选择列表。

Answer 3

为什么不能在ViewModel中使用SelectList？ 它是一种抽象，包含选定的值和项目列表本身。 您可以实现显示/编辑器模板，并使用选择列表定义属性DataTypeAttribute / UIHintAttribute关联特定模板。

 public class ProductViewModel { public int ID { set;get;} public string Name { set;get;} public SelectList Items {get;set;} }