DropDownList Class
Represents a control that allows the user to select a single item from a drop-down list.
For a list of all members of this type, see DropDownList Members.
System.Object
System.Web.UI.Control
System.Web.UI.WebControls.WebControl
System.Web.UI.WebControls.ListControl
System.Web.UI.WebControls.DropDownList
[Visual Basic] Public Class DropDownList Inherits ListControl Implements IPostBackDataHandler [C#] public class DropDownList : ListControl, IPostBackDataHandler [C++] public __gc class DropDownList : public ListControl, IPostBackDataHandler [JScript] public class DropDownList extends ListControl implements IPostBackDataHandler
Thread Safety
Any public static (Shared in Visual Basic) members of this type are thread safe. Any instance members are not guaranteed to be thread safe.
Remarks
Use the DropDownList control to create a single selection drop-down list control. You can control the appearance of the DropDownList control by setting the BorderColor, BorderStyle, and BorderWidth properties.
To specify the items that you want to appear in the DropDownList control, place a ListItem object, for each entry, between the opening and closing tags of the DropDownList control.
The DropDownList control also supports data binding. To bind the control to a data source, create a data source, such as an System.Collections.ArrayList object, that contains the items to display in the control. Then, use the Control.DataBind method to bind the data source to the DropDownList control.
Use the SelectedIndex property to programmatically determine the index of the item selected by the user from the DropDownList control.
Example
[Visual Basic, C#] The following example demonstrates how to create a DropDownList control that contains four items.
[Visual Basic] <%@ Page Language="VB" AutoEventWireup="True" %> <html> <script runat="server" > Sub Selection_Change(sender As Object, e As EventArgs) ' 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) End Sub </script> <body> <form 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> </form> </body> </html> [C#] <%@ Page Language="C#" AutoEventWireup="True" %> <html> <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> <body> <form 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> </form> </body> </html>
[Visual Basic, C#] The following example demonstrates how to create a DropDownList control though data binding.
[Visual Basic] <%@ Page Language="VB" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <html> <script runat="server" > Sub Selection_Change(sender as Object, e As EventArgs) ' 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) End Sub Sub Page_Load(sender as Object, e As EventArgs) ' Load data for the DropDownList control only once, when the ' page is first loaded. If Not IsPostBack Then ' 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 End If End Sub Function CreateDataSource() As ICollection ' Create a table to store data for the DropDownList control. Dim dt As DataTable = New DataTable() ' Define the columns of the table. dt.Columns.Add(new DataColumn("ColorTextField", GetType(String))) dt.Columns.Add(new DataColumn("ColorValueField", GetType(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. Dim dv As DataView = New DataView(dt) Return dv End Function Function CreateRow(Text As String, Value As String, dt As DataTable) As DataRow ' Create a DataRow using the DataTable defined in the ' CreateDataSource method. Dim dr As DataRow = 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 End Function </script> <body> <form 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> </form> </body> </html> [C#] <%@ Page Language="C#" AutoEventWireup="True" %> <%@ Import Namespace="System.Data" %> <html> <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> <body> <form 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> </form> </body> </html>
[C++, JScript] No example is available for C++ or JScript. To view a Visual Basic or C# example, click the Language Filter button
in the upper-left corner of the page.
Requirements
Namespace: System.Web.UI.WebControls
Platforms: Windows 2000, Windows XP Professional, Windows Server 2003 family
Assembly: System.Web (in System.Web.dll)
See Also
DropDownList Members | System.Web.UI.WebControls Namespace | BorderColor | BorderStyle | BorderWidth | ListItem | System.Collections.ArrayList | Control.DataBind | SelectedIndex