[转]ASP.NET MVC Select List Example
本文转自:http://www.aspnetmvcninja.com/views/asp-net-mvc-select-list-example
Select lists are a great way to allow users to select multiple options from a long list of possible values. But how do you implement a select list in ASP.NET MVC? Luckily ASP.NET MVC does most of the heavy lifting for you. For this example I’m going to use a product that has multiple categories.
I’ll start by defining two model classes. The first class is called Category and I’ll use a list of them to store the possible values that will be displayed in the select list. For this example I’ll manually populate these in the controller but you could just as easily load them from a database. The other class is Product which has many category ID’s stored in the CategoryID property (a collection of int’s).
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
namespace MvcApplication2.Models{ public class Category { public int ID { get; set; } public string Name { get; set; } } public class Product { public ICollection<int> CategoryID { get; set; } public Product() { CategoryID = new List<int>(); } }} |
Next we need a controller.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
namespace MvcApplication2.Controllers{ public class HomeController : Controller { private List<Category> GetOptions() { List<Category> categories = new List<Category>(); categories.Add(new Category() { ID = 1, Name = "Bikes" }); categories.Add(new Category() { ID = 2, Name = "Cars" }); categories.Add(new Category() { ID = 3, Name = "Trucks" }); return categories; } public ActionResult Index() { Product product = new Product(); ViewBag.Categories = GetOptions(); return View(product); } [HttpPost] public ActionResult Index(Product product) { ViewBag.Categories = GetOptions(); return View(product); } }} |
I’ve created a private method called GetOptions() to populate a list with the categories. In real world applications you’ll have a service (business logic) class that provides these.
GET requests are handled by the first Index action. It passes the select list options to the view using the ViewBag. You could use ViewData just as easily. It also creates a new Product which becomes the model for the view. If you want to pre-select values then simply add them as follows:
|
1
2
|
product.CategoryID.Add(1);product.CategoryID.Add(3); |
The second Index action handles POST requests. The values for product are populated by the default binder that comes with ASP.NET MVC. This will add all of the values the user selected on the form so you don’t need to do anything.
Finally I have a view that displays the selected values as an unordered list with a select list below it allowing you to change the selected options.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
|
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<MvcApplication2.Models.Product>" %><!DOCTYPE html><html><head runat="server"> <title>ASP.NET MVC Select List Example</title> <link type="text/css" href="../../Content/Site.css" rel="Stylesheet" /></head><body> <div><h1>Select Values</h1><ul><% foreach (int c in Model.CategoryID) { %> <li><%: c %></li><% } %></ul><%: Html.DisplayForModel() %><h1>Change Values</h1><% using (Html.BeginForm()) { %> <%: Html.ListBoxFor(x => x.CategoryID, new MultiSelectList(ViewBag.Categories, "ID", "Name", Model.CategoryID)) %> <br /> <input type="submit" value="Submit" /><% } %> </div></body></html> |
In the view I’m using the Html.ListBoxFor() helper to render the select list. The second value passed to this is a list of options which I’m building using the MultiSelectList class. The constructor I’m using accepts 4 parameters:
- A list of options. In our example it’s List<Category>.
- The name of the property that contains the value used in the select list. I’m using “ID” here because I want to use the ID property of Category.
- The name of the property the contains the text to use for each option. I’m using “Name” here because I want to use the Name property of Category.
- A list of currently select values.
You may be wondering why I pass a list of Category objects to the view instead of creating the MultiSelectList in the controller and then passing that to the view. Personally I find creating the MultiSelectList in the controller both makes the controller more complicated and mixes view logic with controller logic. I also find this approach works better in real world applications where you are probably getting the list of options from a service class. By doing it this way it’s possible to mock the service and test that the value returned by the service class is passed to the view correctly when writing unit tests.
Here’s what it looks like when you first display the select list…

… and after you’ve selected some values

- See more at: http://www.aspnetmvcninja.com/views/asp-net-mvc-select-list-example#sthash.bzAba6tW.dpuf
[转]ASP.NET MVC Select List Example的更多相关文章
- ASP.NET MVC Select无限级分类选择下拉框
1:读取父级下的所有子类别 *ViewBag.ParentItemList:不能与ParentId相同 private void ParentDropDownList() { List<SAS. ...
- asp.net mvc select用法
var statusSelectItems = new List<SelectListItem> { "}, "}, "}, "}, "} ...
- 在ASP.NET MVC中实现Select多选
我们知道,在ASP.NET MVC中实现多选Select的话,使用Html.ListBoxFor或Html.ListBox方法就可以.在实际应用中,到底该如何设计View Model, 控制器如何接收 ...
- ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第二章:利用模型类创建视图、控制器和数据库
在这一章中,我们将直接进入项目,并且为产品和分类添加一些基本的模型类.我们将在Entity Framework的代码优先模式下,利用这些模型类创建一个数据库.我们还将学习如何在代码中创建数据库上下文类 ...
- ASP.NET MVC开发:Web项目开发必备知识点
最近加班加点完成一个Web项目,使用Asp.net MVC开发.很久以前接触的Asp.net开发还是Aspx形式,什么Razor引擎,什么MVC还是这次开发才明白,可以算是新手. 对新手而言,那进行A ...
- 【第三篇】ASP.NET MVC快速入门之安全策略(MVC5+EF6)
目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...
- ASP.NET MVC 使用 Petapoco 微型ORM框架+NpgSql驱动连接 PostgreSQL数据库
前段时间在园子里看到了小蝶惊鸿 发布的有关绿色版的Linux.NET——“Jws.Mono”.由于我对.Net程序跑在Linux上非常感兴趣,自己也看了一些有关mono的资料,但是一直没有时间抽出时间 ...
- 使用Metrics.NET 构建 ASP.NET MVC 应用程序的性能指标
通常我们需要监测ASP.NET MVC 或 Web API 的应用程序的性能时,通常采用的是自定义性能计数器,性能计数器会引发无休止的运维问题(损坏的计数器.权限问题等).这篇文章向你介绍一个新的替代 ...
- 你从未知道如此强大的ASP.NET MVC DefaultModelBinder
看到很多ASP.NET MVC项目还在从request.querystring或者formContext里面获取数据,这实在是非常落后的做法.也有的项目建了大量的自定义的modelbinder,以为很 ...
随机推荐
- java 注解(转)
第一部分:了解一下java1.5起默认的三个annotation类型: 一个是@Override:只能用在方法之上的,用来告诉别人这一个方法是改写父类的. 一个是@Deprecated:建 ...
- as3+java+mysql(mybatis) 数据自动工具(六)
这篇来写一些常量定义的实例.我一般在配置常量的时候,都会让 bitOffset = 20,这样是一个比较好的分配,就是每个分组可以有 0xFFFFF(1048575) 个常量,0xFFF(4095) ...
- 问题:关于坛友的一个定时重复显示和隐藏div的实现
需求:打开页面只看到DIV2,等完秒数之后在显示DIV3.手动关闭DIV3后在重新数秒 我设置的间隔时间是3秒,代码如下: html+css: 1: <!DOCTYPE HTML> htm ...
- 专门为公共部门和联邦机构所设计Microsoft Azure
微软正式发布Microsoft Azure for Government,该云平台专门为公共部门和联邦机构所设计. 在2014年三月微软联邦执行官论坛上宣布的Microsoft Azure for G ...
- 【原创】setjmp longjump一些注意点及使用方法
setjmp longjump一些注意点及使用方法 jmp_buf结构体的定义 #define _JBLEN 9typedef struct { int _jb[_JBLEN + 1]; } jmp ...
- PC问题-使用BAT方法清理Delphi临时文件
@echo offdel /S *.~*del /S *.dcudel /S *.dskdel /S *.hppdel /S *.ddpdel /S *.mpsdel /S *.mptdel /S * ...
- Codeforces Wilbur and Array
Description Wilbur the pig is tinkering with arrays again. He has the array a1, a2, ..., an initiall ...
- gtest框架使用
gtest文档说明: 由于公司单元测试的需要,自己花了大半天时间下载了一个gtest框架,使用了一些测试例子,总览了coderzh的玩转gtest测试框架,又看了几篇gtest博客,写下了以下内容,作 ...
- Android 添加、移除和判断 桌面快捷方式图标
思路: Launcher为了应用程序能够定制自己的快捷图标,就注册了一个 BroadcastReceiver 专门接收其他应用程序发来的快捷图标定制信息.所以只需要根据该 BroadcastRecei ...
- 按要求编写一个Java应用程序: (1)定义一个类,描述一个矩形,包含有长、宽两种属性,和计算面积方法。 (2)编写一个类,继承自矩形类,同时该类描述长方体,具有长、宽、高属性, 和计算体积的方法。 (3)编写一个测试类,对以上两个类进行测试,创建一个长方体,定义其长、 宽、高,输出其底面积和体积。
package jvxing; public class Jvxing { //成员变量 private double width; private double chang; public doub ...