DropDown

The DropDown control represents a customizable drop-down list control.

Server side

Adding items

Use the Items property to specify the collection of items that should be displayed in the control's drop-down list. Each item is represented by the DropDownItem class and exposes Text, Value and ImageUrl properties. Use DropDown.Items.Add method to add items to the control's Items collection.

C#

DropDownItem item = new DropDownItem ();
item.Text= "Item 1";
DropDown1.Items.Add(item);
DropDown1.DataBind();

VB.NET

Dim item As New DropDownItem()
item.Title = "Item 1"
DropDown1.Items.Add(item)
DropDown1.DataBind()

Removing items

Use DropDown.Items.Remove or DropDown.Items.RemoveAt methods to remove items from the control's Items collection.

C#

DropDown1.Items.RemoveAt(0);
DropDown1.DataBind();

VB.NET

DropDown1.Items.RemoveAt(0)
DropDown1.DataBind()

DataBinding

Use the DataSource or DataSourceID properties to specify a data source to populate the control's Items collection. The DataTextField property specifies which data source field will be bound to the items' Text property and the DataValueField specifies the field for the items' Value property.

C#

DropDown1.DataSourceID = "TestDB";
DropDown1.DataValueField = "Id";
DropDown1.DataTextField = "Name";
DropDown1.DataBind();

VB.NET

DropDown1.DataSourceID = "TestDB"
DropDown1.DataValueField = "Id"
DropDown1.DataTextField = "Name"
DropDown1.DataBind()

Getting and setting the control's selected item

Use the DropDown.SelectedIndex or DropDown.SelectedValue properties to get or set the control's selected item.

Customizing the control

Use the HeaderTemplate, ItemTemplate and FooterTemplate properties to customize the drop-down list look and feel.

Adjust the interaction with the control by setting the SubmitOnEnter and AutoPostBack properties according to your needs. Use the AutoComplete property to enable the automatic completion of user's input.

By setting the EmptyText property you can display a hint to the user, and by setting the Label and LabelPosition properties you can specify a caption for the control.

Events

The following events are exposed by the DropDown class.

Event	Event arguments	Description
SelectedIndexChanged	EventArgs	Raised when the control's selected item has changed.

Client side

Getting a reference to the control

You can access the control on the client side by its ClientID.

JavaScript

var dropDown = $find("DropDown1");
var dropDown = $find("<%= DropDown1.ClientID %>");

Getting and setting the control's selected item

Use the get_selectedIndex and set_selectedIndex methods to get or set the control's selected item.

JavaScript

dropDown.set_selectedIndex(2);
alert(dropDown.get_items()[dropDown.get_selectedIndex()].text);

Events

The following client-side events are exposed by the DropDown class.

Event	Event arguments	Script property	Description
selectedIndexChanging	ValueChangingEventArgs	SelectedIndexChangingScript	Raised when a control's selected item is about to be changed.
selectedIndexChanged	ValueChangedEventArgs	SelectedIndexChangedScript	Raised when a control's selected item has changed.
controlLoaded	-	ControlLoadedScript	Raised just after the control has finished loading and is ready for interaction.