在ASP.NET MVC中使用DropDownList

在ASP.NET MVC中,尽管我们可以直接在页面中编写HTML控件,并绑定控件的属性,但更方便的办法还是使用HtmlHelper中的辅助方法。在View中,包含一个类型为HtmlHelper的属性Html,它为我们呈现控件提供了捷径。

我们今天主要来讨论Html.DropDownList的用法,首先从Html.TextBox开始。

Html.TextBox有一个重载方法形式如下:

public static string TextBox(this HtmlHelper htmlHelper, string name, object value);

其中name参数为文本框name属性(以及id属性)的值,value参数为文本框的默认值(即value属性的值)。如果value参数为null或者使用没有value参数的重载方法,那么此时name参数同时还是一个键值,负责获取文本框的默认值。获取的顺序为,先从ViewData中查找是否存在键值为name值的项,如果ViewData中没有则从ViewData.Model中查找是否存在名称为name值的属性,如果仍然不存在,则返回null。(具体参见HtmlHelper的InputHelper辅助方法)

也就是说

public ActionResult Test()
{
    ViewData["Name"] = "Jade";
    return View();
}
<%= Html.TextBox("Name")%>

这样的代码将会输出这样的HTML:

<input id="Name" name="Name" type="text" value="Jade" />

由于TextBox的id和name属性的值与ViewData中的某一项同名(均为Name),因此TextBox的value属性的值将自动绑定为ViewData中Name项的值。不仅是ViewData,如果view model的类型包含Name属性,也将输出同样的结果:

var user = new User { Name = "Jade" };
ViewData.Model = user;
return View();

如果ViewData和ViewData.Model中同时存在Name,则优先使用ViewData中的项。

CheckBox、Hidden、Password、RedioButton等控件也是如此,它们与TextBox一样都使用input标记,属性绑定的规则大致相同。

DropDownList则与TextBox等控件不同,它使用的是select标记。它需要两个值:在下拉框中显示的列表,和默认选项。而自动绑定一次只能绑定一个属性,因此你需要根据需要选择是绑定列表,还是默认选项。

DropDownList扩展方法的各个重载版本“基本上”都会传递到这个方法上:

public static string DropDownList(this HtmlHelper htmlHelper,
    string name,
    IEnumerable<SelectListItem> selectList,
    string optionLabel,
    IDictionary<string, object> htmlAttributes) {
    …
}

如果没有指定selectList,该方法将自动绑定列表,即从ViewData中查找name所对应的值。如果提供了selectList,将自动绑定默认选项,即从selectList中找到Selected属性为true的SelectedListItem。(具体参见HtmlHelper方法的SelectInternal辅助方法)

例1:如果在Action方法中有如下代码:

List<SelectListItem> items = new List<SelectListItem>();
items.Add(new SelectListItem { Text = "Kirin", Value = "29" });
items.Add(new SelectListItem { Text = "Jade", Value = "28", Selected = true});
items.Add(new SelectListItem { Text = "Yao", Value = "24"});
this.ViewData["list"] = items;

在View中这样使用:

<%=Html.DropDownList("list")%>

那么辅助方法将率先从ViewData中获取key为list的项,如果该项为IEnumerable<SelectedListItem>类型则绑定到下拉框中,否则将抛出InvalidOperationException。由于第二个SelectListItem的Selected为true,则默认选中第二个。

例2:如果Action中代码如下:

List<SelectListItem> items = new List<SelectListItem>();
items.Add(new SelectListItem { Text = "Kirin", Value = "29" });
items.Add(new SelectListItem { Text = "Jade", Value = "28"});
items.Add(new SelectListItem { Text = "Yao", Value = "24"});
this.ViewData["list"] = items;
this.ViewData["selected"] = 24;

View中的代码如下:

<%=Html.DropDownList("selected", ViewData["list"] as IEnumerable<SelectListItem>)%>

那么辅助方法将ViewData["list"]绑定为下拉框,然后从ViewData中获取key为selected的项,并将下list中Value值与该项的值相等的SelecteListItem设为默认选中项。

以上两种方法尽管可以实现DropDownList的正确显示,但并非最佳实践。在实际项目中,我们更希望在代码中使用强类型。例如上面两例中,SelectListItem的Text和Value本来是User对象的Name和Age属性,然而上面的代码却丝毫体现不出这种对应关系。如果User列表是从数据库或其他外部资源中获得的,我们难道要用这样的方式来绑定吗?

var users = GetUsers();
foreach (var user in users)
{
    items.Add(new SelectListItem { Text = user.Name, Value = user.Age.ToString() });
}

这显然是我们所无法容忍的。那么什么是最佳实践呢?

ASP.NET MVC为DropDownList和ListBox(都在html中使用select标记)准备了一个辅助类型:SelectList。SelectList继承自MultiSelectList,而后者实现了IEnumerable<SelectListItem>。也就是说,SelectList可以直接作为Html.DropDownList方法的第二个参数。

MultiSelectList包含四个属性,分别为:

  • Items:用于在select标记中出现的列表,通常使用option标记表示。IEnumerable类型。
  • DataTextField:作为option的text项,string类型。
  • DataValueField:作为option的value项,string类型。
  • SelectedValues:选中项的value值,IEnumerable类型。

显然,作为DropDownList来说,选中项不可能为IEnumerable,因此SelectList提供了一个新的属性:

  • SelectedValue:选中项的value值,object类型。

同时,SelectList的构造函数如下所示:

public SelectList(IEnumerable items, string dataValueField, string dataTextField, object selectedValue)
    : base(items, dataValueField, dataTextField, ToEnumerable(selectedValue)) {
    SelectedValue = selectedValue;
}

于是我们的代码变为:

var users = GetUsers();
var selectList = new SelectList(users, "Age", "Name", "24");
this.ViewData["list"] = selectList;
<%=Html.DropDownList("list")%>

当然,你也可以使用不带selectedValue参数的构造函数重载,而在view中显式指定IEnumerable<SelectListItem>,并在ViewData或view model中指定其他与DropDownList同名的项作为默认选项。

最后让我们来回顾一下DropDownList的三种用法:

  1. 建立IEnumerable<SelectListItem>并在其中指定默认选中项。
  2. 建立IEnumerable<SelectListItem>,在单独的ViewData项或view model的属性中指定默认选中项。
  3. 使用SelectList。

好了,关于DropDownList的用法我们今天就讨论到这里,您会用了吗?

时间: 2024-10-20 13:46:05

在ASP.NET MVC中使用DropDownList的相关文章

&lt;转&gt;ASP.NET学习笔记之在ASP.NET MVC中使用DropDownList

看到一篇关于dropdownlist的用法很好的阐述,比较清楚,留着,防止以后自己不记得,还可以瞅瞅. 在ASP.NET MVC中,尽管我们可以直接在页面中编写HTML控件,并绑定控件的属性,但更方便的办法还是使用HtmlHelper中的辅助方法.在View中,包含一个类型为HtmlHelper的属性Html,它为我们呈现控件提供了捷径. 我们今天主要来讨论Html.DropDownList的用法,首先从Html.TextBox开始. Html.TextBox有一个重载方法形式如下: publi

Asp.Net MVC中DropDownListFor的用法(转)

2016.03.04 扩展:如果 view中传入的是List<T>类型 怎么使用 DropList 既然是List<T> 那么我转化成 T  List<T>的第一个,最后一个不就是M吗? @Html.DropDownListFor(model=>model.First().Title, ViewData["Title"] as List<SelectListItem>, "标题", @"dropdown

Asp.net MVC5中Html.DropDownList的使用

一.静态下拉列表项的绑定 在下拉列表中绑定静态项,我们可以通过 SelectListItem 的集合作为数据源的下拉列表. 1 @Html.DropDownList("dropRoles", new List<SelectListItem>() 2 { 3 new SelectListItem() { Text= "Yes", Value = "true" }, 4 new SelectListItem() { Text= "

ASP.NET MVC 中使用用户控件——转

讲讲怎么在 ASP.NET MVC2中使用用户控件.首先我们新建一个用户控件, 我们命名为SelectGroup.ascx,代码如下 <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %> <script language="javascript" type="text/javascript" src="<%

在 ASP.NET MVC 中使用 HTML Helpers 的那些事

在 ASP.NET MVC 中使用 HTML Helpers 方法,可以返回得到标准的 HTML 标签,就像 <input>.<button> 或者 <img> 等等. 同样,你也可以创建自己的 HTML Helpers 方法,生成更加复杂的 HTML 内容. 几种不同类型的 HTML Helpers 从以下三种类型去考察 HTML Helpers 的创建和使用 01 在 View 中创建并重复使用 1 @helper ListingItems(string[] ite

ASP.NET MVC中实现属性和属性值的组合,即笛卡尔乘积01, 在控制台实现

在电商产品模块中必经的一个环节是:当选择某一个产品类别,动态生成该类别下的所有属性和属性项,这些属性项有些是以DropDownList的形式存在,有些是以CheckBoxList的形式存在.接着,把CheckBoxList的选中项组合生成产品SKU项. 本系列将在ASP.NET MVC中实现以上功能.但本篇,先在控制台实现属性值的笛卡尔乘积. 关于属性的类: public class Prop { public int Id { get; set; } public string Name {

004.ASP.NET MVC中的HTML Helpers

原文链接:http://www.codeproject.com/Articles/794579/ASP-NET-MVC-HTML-Helpers-A-MUST-KNOW 1.什么是HTML Helpers 想像HTML Helpers的方法返回一个字符串,是的,它返回的字符串是带有HTML标签的字符串.比如一个img标签.一个a标签,等其它的标签. 有ASP.NET开发经验的人开发人员能使用HTML Helpers用于Web Form服务器控件的编写,因为它们两有一个共同的目标.但是HTML H

ASP.NET MVC中的cshtml页面中的下拉框的使用

ASP.NET MVC中的cshtml页面中的下拉框的使用 用上@Html.DropDownList 先记下来..以做备忘...

log4net 使用总结- (2)在ASP.NET MVC 中使用

log4net在ASP.NET MVC中的配置,还有一种配置方式,即不在web.config中,而是单独新建一个log4net.config 在根目录下 第一.引用log4net.dll 第二.在站点根目录下增加log4net.config <?xml version="1.0" encoding="utf-8" ?> <configuration> <configSections> <section name="