Add Attributes to Drop Down List Items in ASP.NET

By using Drop Down Lists in Asp.Net we can bind two fields, one is for Drop Down list value field and another is for Drop Down list text field. But for some times we may need to bind extra fields also. We can easily bind extra fields by using Attributes of Asp.Net Drop Down List Items.

To bind extra fields for Drop Down lists in Asp.Net, add extra field as  attribute for each list item as shown below.

Defualt.aspx:

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>Add Attributes to Drop Down List Items in ASP.NET</title>

</head>

<body>

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

    <div>

        <asp:DropDownList ID="ddl" Width="150px" runat="server">

        </asp:DropDownList>

        <br />

        <asp:Button ID="btn" Text="Get Attributes" runat="server" OnClick="btn_Click" />

    </div>

    </form>

</body>

</html>

 

Default.aspx.cs:

using System;

using System.Collections;

using System.Data;

using System.Web.UI.WebControls;

 

public partial class _Default : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            BindData();

        }

        else

        {

            if (ViewState["AttributesData"] != null)

                AddAttributes((ArrayList)ViewState["AttributesData"]);

        }

    }

 

    protected void btn_Click(object sender, EventArgs e)

    {

       foreach(ListItem lItem in ddl.Items)

       {

           Response.Write("<b>Id:</b> " + lItem.Value + "; <b>Name:</b> " + lItem.Text + "; <b>Salary:</b> " + lItem.Attributes["Salary"] + "<br/>");

       }

    }

 

    private void BindData()

    {

        try

        {

            DataSet dsEmployees = new DataSet();

            ArrayList arrAttributes = new ArrayList();

            dsEmployees.ReadXml(Server.MapPath("Employees.xml"));

 

            ddl.DataSource = dsEmployees.Tables[0];

            ddl.DataValueField = "Id";

            ddl.DataTextField = "Name";

            ddl.DataBind();

 

            for (int row = 0; row < dsEmployees.Tables[0].Rows.Count; row++)

                arrAttributes.Add(dsEmployees.Tables[0].Rows[row]["Salary"]);

 

            //Save Attributes Data to add in postback

            ViewState["AttributesData"] = arrAttributes;

            AddAttributes(arrAttributes);           

        }

        catch (Exception ex)

        {

            throw ex;

        }

    }

 

    private void AddAttributes(ArrayList arrAttributes)

    {

        int n = 0;

        foreach (ListItem lItem in ddl.Items)

        {

            lItem.Attributes.Add("Salary", arrAttributes[n].ToString());

            n = n + 1;

        }

    }

}

 

As shown above, in BindData() method we are binding the Id as value field and Name as text field from Employees.xml file.

In AddAttributes() method we are adding the extra field Salary as attribute by using Attributes property of ListItem. But in Asp.Net for Drop Down List only Value field and Text field will store in ViewState, that means on postback Drop Down List have only Value field and Text fields. So you have to store attributes data in ViewState or in Session and bind ViewState(or Session) data again with drop down list. Here we are storing the Attributes data in ViewState and binding this ViewState to data drop down list again on page post back.

On button Click the output is display as shown below.

 

                                                                                                                             AspNetDDLAttributes.zip (3.69 kb)