Share via


DropDownList controle de servidor Web Declarative sintaxe

Permite que os usuários selecionar em uma única seleção lista suspensa. A lista drop-down pode conter qualquer número de itens.

<asp:DropDownList
    AccessKey="string"
    AppendDataBoundItems="True|False"
    AutoPostBack="True|False"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CausesValidation="True|False"
    CssClass="string"
    DataMember="string"
    DataSource="string"
    DataSourceID="string"
    DataTextField="string"
    DataTextFormatString="string"
    DataValueField="string"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Names="string"
    Font-Overline="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    ForeColor="color name|#dddddd"
    Height="size"
    ID="string"
    OnDataBinding="DataBinding event handler"
    OnDataBound="DataBound event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnSelectedIndexChanged="SelectedIndexChanged event handler"
    OnTextChanged="TextChanged event handler"
    OnUnload="Unload event handler"
    runat="server"
    SelectedIndex="integer"
    SelectedValue="string"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    ToolTip="string"
    ValidationGroup="string"
    Visible="True|False"
    Width="size"
>
            <asp:ListItem
                Enabled="True|False"
                Selected="True|False"
                Text="string"
                Value="string"
            />
</asp:DropDownList>

Comentários

Use o DropDownList controle para criar um controle de lista suspensa de seleção única. Você pode controlar a aparência do DropDownList controle definindo a BorderColor, BorderStyle, e BorderWidth Propriedades.

Para especificar os itens que aparecem no DropDownList controlar, coloque um ListItem elemento para cada entrada entre as Rótulos de abertura e fechamento das DropDownList controle.

The DropDownList controle também suporta vinculação de dados. Para BIND o controle a uma fonte de dados, primeiro crie uma fonte de dados, sistema autônomo um ArrayList, que contém sistema autônomo itens a serem exibidos no controle. Em seguida, use o DataBind método para BIND a fonte de dados para o DropDownList controle. Use o DataTextField e DataValueField propriedades para especificar qual campo na fonte de dados para BIND a Text e Value Propriedades de cada listam item no controle, respectivamente. The DropDownList Agora o controle exibirá as informações da fonte de dados.

Use o SelectedIndex propriedade para determinar programaticamente o índice do item selecionado pelo usuário das DropDownList controle. O índice, em seguida, pode ser usado para recuperar o item selecionado do Items coleção do controle.

Para obter informações detalhadas sobre o DropDownList Propriedades e eventos de controle de servidor de Web, consulte o DropDownList documentação.

Exemplo

O exemplo de código a seguir demonstra como criar um DropDownList controle que contém quatro itens.

<%@ Page Language="VB" AutoEventWireup="True" %>

<!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" >

      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>

<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>

<%@ Page Language="C#" AutoEventWireup="True" %>

<!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);

      }

   </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>

O exemplo de código a seguir demonstra como popular um DropDownList controle por meio de vinculação de dados declarativa.

<%@ Page Language="VB"%>
<%@ Import Namespace="System.Drawing" %>
<!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 runat="server">
    <title>DropDownList Declarative DataBinding Sample</title>
    <script runat="server">
        Sub Selection_Change(ByVal sender As Object, ByVal 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 = _
                Color.FromName(ColorList.SelectedItem.Value)
        End Sub
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:XmlDataSource ID="Colors" runat="server">
        <Data>
            <Colors>
                <Color ColorID="White" ColorName="White" />
                <Color ColorID="Silver" ColorName="Silver" />
                <Color ColorID="DarkGray" ColorName="Dark Gray" />
                <Color ColorID="Khaki" ColorName="Khaki" />
                <Color ColorID="DarkKhaki" ColorName="Dark Khaki" />
            </Colors>
        </Data>
    </asp:XmlDataSource>
    Colors: <asp:DropDownList ID="ColorList" 
                DataSourceID="Colors" 
                DataTextField="ColorName" 
                DataValueField="ColorID" 
                runat="server" 
                AutoPostBack="true" 
                OnSelectedIndexChanged="Selection_Change" />
    <p />
    <asp:Calendar ID="Calendar1" runat="server" />
    </form>
</body>
</html>
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Drawing" %>
<!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 runat="server">
    <title>DropDownList Declarative DataBinding Sample</title>
    <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 = 
                Color.FromName(ColorList.SelectedItem.Value);

        }   

</script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:XmlDataSource ID="Colors" runat="server">
        <Data>
            <Colors>
                <Color ColorID="White" ColorName="White" />
                <Color ColorID="Silver" ColorName="Silver" />
                <Color ColorID="DarkGray" ColorName="Dark Gray" />
                <Color ColorID="Khaki" ColorName="Khaki" />
                <Color ColorID="DarkKhaki" ColorName="Dark Khaki" />
            </Colors>
        </Data>
    </asp:XmlDataSource>
    Colors: <asp:DropDownList ID="ColorList" 
                DataSourceID="Colors" 
                DataTextField="ColorName" 
                DataValueField="ColorID" 
                runat="server" 
                AutoPostBack="true" 
                OnSelectedIndexChanged="Selection_Change" />
    <p />
    <asp:Calendar ID="Calendar1" runat="server" />
    </form>
</body>
</html>

O exemplo de código a seguir demonstra como criar um DropDownList vinculação de dados através de programação através de controle.

<%@ Page Language="VB" AutoEventWireup="True" %>
<%@ 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" >

      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>

<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>

<%@ Page Language="C#" AutoEventWireup="True" %>
<%@ 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>

Consulte também

Conceitos

Controles de Servidor do ASP.NET

Referência

Visão geral do controle DropDownList do servidor Web

DropDownList

Outros recursos

controle de servidor Web sintaxe