The DropDownList control is a web server element that creates the drop-down menu and lets users select a single item from various options. You can add any number of items to the DropDownList.
Almost all web pages contain a drop-down list, but it is mostly present in registration forms or sign-in pages. A common occurrence is “Select your Location”, where you have to select one location from various available options.
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.
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.
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.
<
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.