DropDownList
控件使用介绍
使用 DropDownList
控件可以创建只允许从中选择一项的下拉列表控件。可以通过设置
BorderColor、BorderStyle
和
BorderWidth
属性来控制 DropDownList
控件的外观。
若要指定希望显示在 DropDownList
控件中的项，请在 DropDownList
控件的开始和结束标记之间为每个项放置一个
ListItem
对象。
DropDownList
控件也支持数据绑定。若要将控件绑定到数据源，请创建一个包含要显示在控件中的项的数据源，如
System.Collections.ArrayList
对象。然后使用
Control.DataBind
方法将该数据源绑定到 DropDownList
控件。
使用
SelectedIndex
属性以编程方式确定用户从 DropDownList
控件中选择的项的索引。
1.
下面的代码示例演示如何创建包含四个项的 DropDownList
控件。
<%@ Page
Language="C#" AutoEventWireup="True" %>
<!DOCTYPE html PUBLIC
"-//W 3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
>
<script runat="server" >
void Selection_Change(Object sender, EventArgs
e)
{
// Set the background color for days
in the Calendar control
// based on the value selected by the
user from the
// DropDownList
control.
Calendar1.DayStyle.BackColor =
System.Drawing.Color.FromName(ColorList.SelectedItem.Value);
}
</script>
<head runat="server">
<title> DropDownList Example
</title>
</head>
<body>
<form id="form1" runat="server">
<h3> DropDownList Example
</h3>
Select a background color for days in the calendar.
<br /><br
/>
<asp:Calendar id="Calendar1"
ShowGridLines="True"
ShowTitle="True"
runat="server"/>
<br /><br
/>
<table cellpadding="5">
<tr>
<td>
Background color:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="ColorList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server">
<asp:ListItem Selected="True" Value="White"> White
</asp:ListItem>
<asp:ListItem Value="Silver"> Silver
</asp:ListItem>
<asp:ListItem Value="DarkGray"> Dark Gray
</asp:ListItem>
<asp:ListItem Value="Khaki"> Khaki
</asp:ListItem>
<asp:ListItem Value="DarkKhaki"> Dark Khaki
</asp:ListItem>
</asp:DropDownList>
</td>
</tr>
</table>
</form>
</body>
</html>
2.
下面的代码示例演示如何通过数据绑定创建 DropDownList
控件。
<%@ Page Language="C#"
%>
<%@ Import Namespace="System.Data"
%>
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
>
<script runat="server" >
void Selection_Change(Object sender, EventArgs
e)
{
// Set the background color for days
in the Calendar control
// based on the value selected by the
user from the
// DropDownList
control.
Calendar1.DayStyle.BackColor =
System.Drawing.Color.FromName(ColorList.SelectedItem.Value);
}
void Page_Load(Object sender, EventArgs
e)
{
// Load data for the DropDownList
control only once, when the
// page is first
loaded.
if(!IsPostBack)
{
// Specify the data source and field
names for the Text
// and Value properties of the items
(ListItem objects)
// in the DropDownList
control.
ColorList.DataSource = CreateDataSource();
ColorList.DataTextField = "ColorTextField";
ColorList.DataValueField = "ColorValueField";
// Bind the data to the
control.
ColorList.DataBind();
// Set the default selected item, if
desired.
ColorList.SelectedIndex = 0;
}
}
ICollection CreateDataSource()
{
// Create a table to store data for
the DropDownList control.
DataTable dt = new DataTable();
// Define the columns of the
table.
dt.Columns.Add(new DataColumn("ColorTextField", typeof(String)));
dt.Columns.Add(new DataColumn("ColorValueField", typeof(String)));
// Populate the table with sample
values.
dt.Rows.Add(CreateRow("White", "White", dt));
dt.Rows.Add(CreateRow("Silver", "Silver", dt));
dt.Rows.Add(CreateRow("Dark Gray", "DarkGray", dt));
dt.Rows.Add(CreateRow("Khaki", "Khaki", dt));
dt.Rows.Add(CreateRow("Dark Khaki", "DarkKhaki", dt));
// Create a DataView from the
DataTable to act as the data source
// for the DropDownList
control.
DataView dv = new DataView(dt);
return dv;
}
DataRow CreateRow(String Text, String Value, DataTable
dt)
{
// Create a DataRow using the
DataTable defined in the
// CreateDataSource
method.
DataRow dr = dt.NewRow();
// This DataRow contains the
ColorTextField and ColorValueField
// fields, as defined in the
CreateDataSource method. Set the
// fields with the appropriate value.
Remember that column 0
// is defined as ColorTextField, and
column 1 is defined as
//
ColorValueField.
dr[0] = Text;
dr[1] = Value;
return dr;
}
</script>
<head runat="server">
<title> DropDownList Data Binding
Example
</title>
</head>
<body>
<form id="form1" runat="server">
<h3> DropDownList Data Binding
Example
</h3>
Select a background color for days in the calendar.
<br /><br
/>
<asp:Calendar id="Calendar1"
ShowGridLines="True"
ShowTitle="True"
runat="server"/>
<br /><br
/>
<table cellpadding="5">
<tr>
<td>
Background
color:
</td>
</tr>
<tr>
<td>
<asp:DropDownList id="ColorList"
AutoPostBack="True"
OnSelectedIndexChanged="Selection_Change"
runat="server"/>
</td>
</tr>
</table>
</form>
</body>
</html>
3.
DropDownList
控件重要属性
AutoPostBack属性：用于设置当改变选项内容时，是否自动回送到服务器。
True表示回送；False（默认）表示不回送。
DataSource属性：用于指定填充列表控件的数据源。
DataTextField属性：用于指定DataSource中的一个字段，该字段的值对应
于列表项的Text属性。
DataValueField属性：用于指定DataSource中的一个字段，该字段的值对
于列表项的Value属性。
SelectedIndex属性：用于获取下拉列表中选项的索引值。如果未选定任何项，
则返回值-1（负1）。
SelectedItem属性：用于获取列表中的选定项。通过该属性可获得选定项的
Text
和Value属性值。
SelectedValue属性：用于获取下拉列表中选定项的值。
SelectedIndexchanged事件：当用户选择了下拉列表中的任意选项时，都将引
发SelectedIndexChanged事件。
Items属性：表示列表中各个选项的集合，如DropDownList.Items[i]表示第i个选项，i从0开始。每个选项都有以下3个基本属性：
DropDownList.Items[i].Text
属性：表示第i个选项的文本。
DropDownList.Items[i].Value属性：表示第i个选项的选项值。
DropDownList.Items[i].Selected属性：表示第i选项是否被选中。
4.
DropDownList.Items的常用方法
1.
最后一项添加：
DropDownList.Items.Add("text")/DropDownList.Items.Add(New
ListItem("text","value"))
2.
在指定的位置index添加一项：
DropDownList.Items.Insert(index, New
ListItem("text","value"))
3.
移除指定的项：
DropDownList.Items.Remove("text")/DropDownList.Items.RemoveAt(index)
4.
移除所有的项：
DropDownList.Items.Clear()
5.
统计项的总数：
DropDownList.Items.Count
5.
实例（1）：以当前年月为基础创建年月下拉菜单，代码如下：
1.
在.aspx文件中简单添加一个DropDownList控件
<%@ Page Language="C#"
AutoEventWireup="true" CodeFile="Default6.aspx.cs" Inherits="Default6" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD
XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>DropDownList
举例 </title>
</head>
<body>
<form id="form2"
runat="server">
<h3>
年月下拉菜单的创建
</h3>
选择年月：
<asp:DropDownList ID="dropNianyue" runat="server">
</asp:DropDownList>
</form>
</body>
</html>
2.
在.cs文件添加代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
public partial class Default6 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if
(!IsPostBack)
{
InitControls();
}
}
private void InitControls()
{
#region
初始化年月选择
dropNianyue.DataSource
=ConstructNianyue();
dropNianyue.DataTextField = "DateTextField";
dropNianyue.DataValueField = "DateValueField";
//
数据绑定
dropNianyue.DataBind();
//默认选择当前年月
dropNianyue.SelectedIndex = 1;
#endregion
}
public static DataView
ConstructNianyue()
{
//初始化一个空表
DataTable dt = new DataTable();
//
定义表列的内容
dt.Columns.Add(new DataColumn("DateTextField", typeof(String)));
dt.Columns.Add(new DataColumn("DateValueField", typeof(String)));
int nowYear = DateTime.Now.Date.Year;
int nowMonth = DateTime.Now.Date.Month;
//得到空行
DataRow dr =
dt.NewRow();
dr[0] = "--月份--";
dr[1] = "-1";
dt.Rows.Add(dr);
for (int i = 0; i < 24;
i++)
{
if (nowMonth >
0)
{
dr = dt.NewRow();
dr[0] = nowYear.ToString() + "年" + nowMonth + "月";
dr[1] = nowYear.ToString() + "-" + nowMonth;
dt.Rows.Add(dr);
}
else
{
nowYear--;
nowMonth = 13;
}
nowMonth--;
}
DataView dv = new DataView(dt);
return
dv;
}
}
6.
实例（2）：以枚举结构为基础创建下拉菜单，代码如下：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
public partial class Default6 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if
(!IsPostBack)
{
InitControls();
}
}
public enum ReportTypeEnum
{
未知 = 0,
单位产品综合能耗 = 1,
工业企业节能量 = 2,
企业能源购进消费和库存 = 3,
用电及万元产值电耗= 4,
主要能源消耗量 = 5,
综合能耗及万元产值能耗 = 6,
取水量及万元产值取水量= 7,
单位产品取水量和用水量 = 8
}
private void InitControls()
{
#region
dropReport.DataSource = ConstructReportType(typeof(ReportTypeEnum));
dropReport.DataTextField = "ReportTextField";
dropReport.DataValueField = "ReportValueField";
// Bind the data to the
control.
dropReport.DataBind();
dropReport.Items.Insert(0, new
ListItem("-请选择-", "-1"));
// Set the default selected item, if
desired.
dropReport.SelectedIndex = 0;
#endregion
}
public static DataView ConstructReportType(Type
reportTypeEnum)
{
// Create a table to store data for the
DropDownList control.
DataTable dt = new DataTable();
// Define the columns of the
table.
dt.Columns.Add(new DataColumn("ReportTextField", typeof(String)));
dt.Columns.Add(new DataColumn("ReportValueField", typeof(Enum)));
foreach (Enum reportType in Enum.GetValues(reportTypeEnum))
{
if (reportType.ToString() ==
"未知")
continue;
DataRow dr =
dt.NewRow();
dr[0] = reportType.ToString();
dr[1] = reportType;
dt.Rows.Add(dr);
}
// Create a DataView from the DataTable
to act as the data source
// for the DropDownList
control.
DataView dv = new DataView(dt);
return
dv;
}
}
7.
说明
上述实例无论是生成的年月下拉菜单，还是以枚举结构为基础生成的资源利用项下拉菜单，都应该算是DropDownList的静态数据绑定。而对于动态的数据绑定，一般都是因为数据源会在项目运行中发生变化，故要和数据库随时连接。
加载中，请稍候......
加载中…
喜欢