How to add an item at the top of DropDownList in asp.net

asp.net dropdownlist add item to top of list

The following asp.net c# example code demonstrate us how can we add an item to the top of DropDownList existing items collection. Sometimes we have a DropDownList which items are defined in declarative syntax and we need to add an item to the top of items collection programmatically at run time.

To place an item at the top of DropDownList we can take help from items collection Insert() method. Insert() method allow us to insert a ListItem object to an item collections at specified index position. DropDownList items collection are zero-based index. So if we insert an item to the index position zero (0) then it will display at the top of DropDownList server control.

So, first we need to initialize a ListItem object with Text and optionally Value. Then we need to insert the newly created ListItem object at the zero index position of DropDownList items collection. After all, DropDownList will display the newly created ListItem object at the top of its items collection.

dropdownlist-add-item-to-top-of-list.aspx


<%@ Page Language="C#" AutoEventWireup="true"%>  
    
<!DOCTYPE html>
      
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        { 
            ListItem li = new ListItem();
            li.Text = "Common Goldeneye";
            li.Value = "0";
            DropDownList1.Items.Insert(0, li);
        }
    }
    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        Label1.Text = "you selected....<br />";
        Label1.Text += "item: " + DropDownList1.SelectedItem.Text;
        Label1.Text += "<br />value: " + DropDownList1.SelectedItem.Value;
    }
</script>      
      
<html xmlns="http://www.w3.org/1999/xhtml">      
<head id="Head1" runat="server">      
    <title>asp.net dropdownlist add item to top of list</title>
</head>      
<body>      
    <form id="form1" runat="server">      
    <div>      
        <h2 style="color:MidnightBlue; font-style:italic;">      
            asp.net example - dropdownlist add item to top of list
        </h2>      
        <hr width="550" align="left" color="Gainsboro" />      
        <asp:Label       
            ID="Label1"       
            runat="server"      
            Text="select an item from dropdownlist."
            Font-Size="X-Large"
            Width="350"
            >      
        </asp:Label>      
        <br /><br />
        <asp:DropDownList
            ID="DropDownList1"
            runat="server"
            AutoPostBack="true"
            OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged"
            >
            <asp:ListItem Text="Northern Shoveler" Value="1"></asp:ListItem>
            <asp:ListItem Text="Brown Teal" Value="2"></asp:ListItem>
            <asp:ListItem Text="Northern Pintail" Value="3"></asp:ListItem>
            <asp:ListItem Text="Common Teal" Value="4"></asp:ListItem>
            <asp:ListItem Text="Marbled Duck" Value="5"></asp:ListItem>
        </asp:DropDownList>
    </div>      
    </form>      
</body>      
</html>

More asp.net examples