本文转自：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:

  1. A list of options. In our example it’s List<Category>.
  2. 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.
  3. 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.
  4. 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的更多相关文章

  1. ASP.NET MVC Select无限级分类选择下拉框

    1:读取父级下的所有子类别 *ViewBag.ParentItemList:不能与ParentId相同 private void ParentDropDownList() { List<SAS. ...

  2. asp.net mvc select用法

    var statusSelectItems = new List<SelectListItem> { "}, "}, "}, "}, "} ...

  3. 在ASP.NET MVC中实现Select多选

    我们知道,在ASP.NET MVC中实现多选Select的话,使用Html.ListBoxFor或Html.ListBox方法就可以.在实际应用中,到底该如何设计View Model, 控制器如何接收 ...

  4. ASP.NET MVC with Entity Framework and CSS一书翻译系列文章之第二章：利用模型类创建视图、控制器和数据库

    在这一章中,我们将直接进入项目,并且为产品和分类添加一些基本的模型类.我们将在Entity Framework的代码优先模式下,利用这些模型类创建一个数据库.我们还将学习如何在代码中创建数据库上下文类 ...

  5. ASP.NET MVC开发：Web项目开发必备知识点

    最近加班加点完成一个Web项目,使用Asp.net MVC开发.很久以前接触的Asp.net开发还是Aspx形式,什么Razor引擎,什么MVC还是这次开发才明白,可以算是新手. 对新手而言,那进行A ...

  6. 【第三篇】ASP.NET MVC快速入门之安全策略（MVC5+EF6）

    目录 [第一篇]ASP.NET MVC快速入门之数据库操作(MVC5+EF6) [第二篇]ASP.NET MVC快速入门之数据注解(MVC5+EF6) [第三篇]ASP.NET MVC快速入门之安全策 ...

  7. ASP.NET MVC 使用 Petapoco 微型ORM框架+NpgSql驱动连接 PostgreSQL数据库

    前段时间在园子里看到了小蝶惊鸿 发布的有关绿色版的Linux.NET——“Jws.Mono”.由于我对.Net程序跑在Linux上非常感兴趣,自己也看了一些有关mono的资料,但是一直没有时间抽出时间 ...

  8. 使用Metrics.NET 构建 ASP.NET MVC 应用程序的性能指标

    通常我们需要监测ASP.NET MVC 或 Web API 的应用程序的性能时,通常采用的是自定义性能计数器,性能计数器会引发无休止的运维问题(损坏的计数器.权限问题等).这篇文章向你介绍一个新的替代 ...

  9. 你从未知道如此强大的ASP.NET MVC DefaultModelBinder

    看到很多ASP.NET MVC项目还在从request.querystring或者formContext里面获取数据,这实在是非常落后的做法.也有的项目建了大量的自定义的modelbinder,以为很 ...

随机推荐

  1. 安装sql server 出现挂起问题

    1.安装SQL Server的时候出现的情况.“以前的某个程序已在安装计算机上创建挂起的文件操作.运行安装之前必须重新启动计算机”的提示. 2.解决方法 关于SQL安装被挂起的修复大家可能都遇到过当S ...

  2. 【创建本地仓库】【for Centos】CentOS下创建本地repository

    [日期]2014年4月24日 [平台]Centos 6.5 [工具]httpd yum-utils createrepo [步骤] 1)安装httpd. yum install httpd 2)安装y ...

  3. HW7.11

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  4. HW6.16

    import java.util.Arrays; public class Solution { public static void main(String[] args) { int[] arra ...

  5. 在windows2012&2008中设置防火墙允许filezilla的passive模式

    添加入战规则, 允许程序和服务 "filezilla" 被连接 只允许21端口通过防火墙是不够的.

  6. 关于PCB布线的顺序到底是怎样才合理？

    有人说先布好电源线和地线,让它们尽量靠近走,然后再考虑信号线:也有人说先布好关键的信号线,然后再走电源和地线:还有人说先布好电源线,再布信号线,地线最后布.到底怎么样才算好呢?或者说,一般应按照什么顺 ...

  7. ALM11需求类型

  8. GPS两点的距离

    目前手头的一个项目要用到GPS地理定位信息,很自然的就需要知道两个地点之间的距离,于是上网找了一下,同样自然的就有一些算法贴出来..(网络真是帮了大忙,省得我再去翻几何书自己研究算法了!公式早都忘光了 ...

  9. C#操作sql通用类 SQLHelper

    Codeusing System; using System.Data; using System.Configuration; using System.Web; using System.Web. ...

  10. 利用接口做参数，写个计算器，能完成+-*/运算 （1）定义一个接口Compute含有一个方法int computer(int n,int m); （2）设计四个类分别实现此接口，完成+-*/运算 （3）设计一个类UseCompute，含有方法： public void useCom(Compute com, int one, int two) 此方法要求能够：1．用传递过来的对象调用compute

    package com.homework5; public interface Compute { //声明抽象方法 int computer(int n,int m); } package com. ...