All You Need to Know About DropDownList in ASP.NET

Syntax

<asp:DropDownList ID=“Sample” runat=“server”>

<asp:ListItem Enabled=”true” Text= “Select Subject” Value= “-1”></asp:ListItem>

<asp:ListItem Text= “History” Value=”1”><asp:ListItem>

<asp:ListItem Text= “Geography” Value=”2”><asp:ListItem>

</asp:DropDownList>

Explanation

The first line sets the ID of the drop-down list used to set the properties of this particular element, i.e., a DropDownList. The second line to the fourth line describes the items in the list where an item with value -1 is visible to the user before clicking on it. The DropDownList starts and ends with a <asp:DropDownList> tag, similar to HTML.

Properties

DropDownList1.Items.Count 

The Count() property provides us with the total number of options or items in the drop-down list.

DropDownList1.Items.Add(“ItemName”) 

The Add() property lets us add items in the drop-down list by their names.

DropDownList1.Items.Remove(“ItemName”)

The Remove() property lets us remove items from the drop-down list by their names.

DropDownList1.Items.Insert(int index, “ItemName”)

The Insert() property helps us to add new items to the drop-down list at a specific position.

Learn From The Best Mentors in the Industry!

Automation Testing Masters ProgramExplore Program

DropDownList1.Items.RemoveAt(int index) 

The Remove() property has another form, i.e., when provided with the index (position) of an item in the drop-down list, it removes the element or the item by its position.

DropDownList1.Items.Clear() 

As the name suggests, if we want to replace all the items in the drop-down list or if we want to clear everything and start afresh, the Clear() property lets us clear the entire drop-down list.

DropDownList1.SelectionItem.Text 

This property returns the text of the item selected in the drop-down list and hence is a very prominent property.

DropDownList1.SelectedIndex 

The SelectedIndex property returns the index or the position of the selected item in the drop-down list. It always starts from 0.

DropDownList1.DataSource

The DataSource property is mainly associated with the Data Table or the Data Set and comes into action when you need to bind a database or datasheet to the drop-down list.

DropDownList1.DataValueField

The DataValueField property binds the values of the datasheet or database to the drop-down list which is then visible in the dropdown list.

Item 

The Item property provides us with the collection of the items from the drop-down list.

AutoPostBack 

The AutoPostBack property comes with two choices, true or false to enable or disable the automatic postback. The default AutoPostBack value is false. The “true” value indicates that the server is automatically notified about any changes in user selection of the items from the drop-down list. 

DataValueField 

The DataValueField lets us set the name of the column as a value in the drop-down list. The DataValueField is not visible to the end-user.

DataTextField

Unlike the DataValueField, the DataTextField is the text that is visible to the end-user.

For example, DataValueField can be the ID of the employees, stored in the database whereas DataTextField can be the name of the employees, visible to the user. 

Learn 15+ In-Demand Tools and Skills!

Automation Testing Masters ProgramExplore Program

How to Create a DropDownList in ASP.NET?

To create a DropDownList from Visual Studio 2017, follow these steps:

Step 1:

Create a new form by specifying its name. Initially, the web form is empty.

Step 2: 

Click on the toolbox section on the left and drag a DropDownList item from the menu to the web form.

Step 3:

To add items to the list, navigate to the properties window and add items to the list. The property window appears as shown below:

To add items to the list, follow these steps:

Step 1: Click on the Items (Collection) in the properties window. A new window appears that looks similar to the image below:

Step 2: Add items to the Members section by clicking on the Add button on the left and set its properties on the right.

Click Ok to finalize and create the required DropDownList.

<

Become an Automation Test Engineer in 11 Months!

Automation Testing Masters ProgramExplore Program

Example Code for a DropDownList in ASP.NET

//Example.aspx

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true"   

CodeBehind="Default.aspx.cs" Inherits="DropDownListExample._Default" %>  

<!DOCTYPE html>  

<head runat="server">  

    <title></title>  

</head>  

<body>  

    <form id="sample" runat="server">  

        <p>Select a City of Your Choice</p>  

        <div>  

            <asp:DropDownList ID="Sample1" runat="server" >  

            <asp:ListItem Value="">Please Select</asp:ListItem>

            <asp:ListItem>Kolkata </asp:ListItem>

            <asp:ListItem>Gurgaon</asp:ListItem>

            <asp:ListItem>Chicago</asp:ListItem>

            <asp:ListItem>Milan</asp:ListItem>

            <asp:ListItem>Nevada</asp:ListItem>

        </asp:DropDownList>

        </div>

        <br />

        <asp:Button ID="Butt1" runat="server" OnClick="Butt1_Click" Text="Submit" />

        <br />

        <br />

        <asp:Label ID="L1" runat="server" EnableViewState="False"></asp:Label>  

    </form> 

</body>

</html> 

// Example.aspx.cs

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web; 

using System.Web.UI;

using System.Web.UI.WebControls;

namespace DropDownListExample 

{

    public partial class _Default: Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

        }  

        protected void Butt1_Click(object sender, EventArgs e)  

        {  

            if (DropDownList1.SelectedValue == "")

            {

                L1.Text = "Please Select a City";

            }

            else

                L1.Text = "You selected: " + DropDownList1.SelectedValue;

        }

    }

}

Conclusion

The DropDownList in ASP.NET is one of the most common features on web pages. From a simple google form to your application to a job profile, almost every type of form has a drop-down list. It is very useful to provide a list of choices to the user and hence is one of the essential parts of a web form. 

If web form intrigues you, or the idea of creating appealing web pages excites you, you can consider seeking help from professional courses. SimpliLearn provides an excellent Post Graduate program on Full Stack Web Development which not only covers your basics but also prepares you to deal with industry-level problems.

If you have any queries or need clarification on any topic from this article on DropDownList in ASP, you may put them in the comments box below and our experts will address them to your satisfaction.