Share via


DropDownList Web Server Control

Enables users to select from a single-selection drop-down list. The drop-down list can contain any number of items.

<asp:DropDownList id="DropDownList1" runat="server"
     DataSource="<% databindingexpression %>"
     DataTextField="DataSourceField"
     DataValueField="DataSourceField"
     AutoPostBack="True|False"
     OnSelectedIndexChanged="OnSelectedIndexChangedMethod">

   <asp:ListItem value="value" selected="True|False">
      Text
   </asp:ListItem>

</asp:DropDownList>

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 appear in the DropDownList control, place a ListItem element 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, first create a data source, such as a System.Collections.ArrayList, that contains the items to display in the control. Next, use the Control.DataBind method to bind the data source to the DropDownList control. Use the DataTextField and DataValueField properties to specify which field in the data source to bind to the Text and Value properties of each list item in the control, respectively. The DropDownList control will now display the information from the data source.

Use the SelectedIndex property to programmatically determine the index of the item selected by the user from the DropDownList control. The index can then be used to retrieve the selected item from the Items collection of the control.

For detailed information on the DropDownList Web server control's properties and events, see the DropDownList documentation.

Example

The following example demonstrates how to use the DropDownList control.

<%@ Page Language="VB" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      Sub Button_Click(sender As Object, e As EventArgs)
         Label1.Text = "You selected " & _
                       DropDownList1.SelectedItem.Text & "."
      End Sub 'Button_Click
   </script>
</head>
<body>
   <form runat="server">
      <h3>DropDownList Example</h3>
      Select an item from the list and click the submit button.
      <p>
      <asp:DropDownList id="DropDownList1" 
           runat="server">
         <asp:ListItem>Item 1</asp:ListItem>
         <asp:ListItem>Item 2</asp:ListItem>
         <asp:ListItem>Item 3</asp:ListItem>
         <asp:ListItem>Item 4</asp:ListItem> 
      </asp:DropDownList>
      <br><br>
      <asp:Button id="Button1" 
           Text="Submit" 
           OnClick="Button_Click" 
           runat="server"/>
      <br><br>
      <asp:Label id="Label1" 
           runat="server"/>
   </form>
</body>
</html>
[C#]
<%@ Page Language="C#" AutoEventWireup="True" %>
<html>
<head>
   <script runat="server">
      void Button_Click(Object sender, EventArgs e) 
      {
         Label1.Text = "You selected: " + 
         dropdownlist1.SelectedItem.Text + ".";         
      }
   </script>
</head>
<body>
   <form runat="server">
      <h3>DropDownList Example</h3>
      Select an item from the list and click the submit button.
      <p>
      <asp:DropDownList id="dropdownlist1" runat="server">
         <asp:ListItem>Item 1</asp:ListItem>
         <asp:ListItem>Item 2</asp:ListItem>
         <asp:ListItem>Item 3</asp:ListItem>
         <asp:ListItem>Item 4</asp:ListItem>
      </asp:DropDownList>
      <br><br>
      <asp:Button id="Button1"  
           Text="Submit" 
           OnClick="Button_Click" 
           runat="server"/>
      <br><br>
      <asp:Label id="Label1" runat="server"/>
   </form>
</body>
</html>

See Also

Web Server Controls | DropDownList Class