Dropdownlist in asp.net

Suggested Videos
Part 13 - HyperLink Control
Part 14 - Button, LinkButton and ImageButton Controls
Part 15 - Command Event of an asp.net button control

In this video we will learn about 
1. Adding items to the DropDownList control at design time using the HTML
2. Adding items to the DropDownList control at runtime using the code

Drag and drop a DropDownList control onto the webform. 

To add items to the DropDownList at deign time
1. Right click on the DropDownList control and select properties. 
2. In the properties, click on the ellipsis button next to Items property.
3. In the ListItem Collection Editor window, click the Add button
4. Set the Text to Male and Value to 1.
5. Click the Add button again, which will add another ListItem object
6. Set the Text to Female and Value to 2.
7. Finally click OK



Now switch the webform to source mode. Notice that in the HTML it has added ListItem object, as shown below.
<asp:DropDownList ID="DropDownList1" runat="server">
    <asp:ListItem Value="1">Male</asp:ListItem>
    <asp:ListItem Value="1">Female</asp:ListItem>
</asp:DropDownList>

If you run the web application now, you should see that Male and Female items shown in the DropDownList.

If you want a specific listitem to be selected in the dropdownlist, when the page loads, then set the Selected property of the ListItem object to true. This can be done in 2 ways.
1. Using the ListItem Collection Editor window or
2. In the HTML of the webform

The HTML with the Selected property is shown below.
<asp:DropDownList ID="DropDownList1" runat="server">
    <asp:ListItem Value="1">Male</asp:ListItem>
    <asp:ListItem Value="1" Selected="True">Female</asp:ListItem>
</asp:DropDownList>

To hide a ListItem in the DropDownList, set the Enabled property to False.



To add items to the DropDownList at run time using code
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        ListItem maleListItem = new ListItem("Male", "1");
        ListItem femaleListItem = new ListItem("Female", "2");

        DropDownList1.Items.Add(maleListItem);
        DropDownList1.Items.Add(femaleListItem);
    }
}

If you are adding listitem objects, to the DropDownList in the Page_Load event, make sure you do only when the page is loaded for the first time. Otherwise, every time, you post the page back, by clicking a button, the list items will be added again causing duplication.

A DropDownList is a collection of ListItem objects. Along the same lines, the following controls are also a collection of ListItem objects. So, adding items to these controls is also very similar to DropDownList.
1. CheckBoxList
2. RadioButtonList
3. BulletedList
4. ListBox

In the next video session, we will discuss about binding the dropdownlist to the data from a database and an XML file.

No comments