Highlight DropDownList Item Color in ASP.Net

This article explains:

• How to dynamically bind DropDownList from SQL Server database table.
• How to highlight DropDownList item color based on condition or flag.

Database

I used the following table and Stored Procedure to show that.



Use the following script to create the preceding table Mas_Department.

Create Table Mas_Department
(
DeptId int Primary Key,
DeptName varchar(50),
Status bit
)

To insert the records:

insert Mas_Department values(1, 'IT', 1)
insert Mas_Department values(2, 'HR', 1)
insert Mas_Department values(3, 'Accounts', 1)
insert Mas_Department values(7, 'FieldTechnician', 0)
insert Mas_Department values(4, 'Sales', 1)
insert Mas_Department values(5, 'BPO', 0)
insert Mas_Department values(6, 'Finance', 1)
insert Mas_Department values(7, 'FieldTechnician', 0)

Use the following script to create the Stored Procedure USP_Select_Mas_Department to get all the Departments.

Create procedure [dbo].[USP_Select_Mas_Department] AS Begin
Select
D.DeptId,
D.DeptName as Department,
D.Status
From
Mas_Department D END

Create the project

Go to "Start", then click "All Programs" and open "Microsoft Visual Studio 2010".

In "Microsoft Visual Studio 2015", go to "File", then click "New" and select "Project". Now select "C#" and click "ASP.NET Empty Web Application".

Provide the project the name as you wish and specify the location.

Web.Config

Create the connection string in the Web.Config file as shown in the following:

<connectionStrings>
    <add name="conStr"
         connectionString="Password=1234; User ID=sa; Database=DB_Jai; Data Source=."
         providerName="System.Data.SqlClient"/>
</connectionStrings>

Next right-click on the Solution Explorer and add a web form to your project.

.aspx file

Design the .aspx page as in the following:

<form id="form1" runat="server">
    <div align="center">
        <fieldset style="width: 30%;">
            <legend>Highlight DropDownList Item Color</legend>
            <table style="width: 25%;">
                <tr>
                    <td>
                        Department :
                    </td>
                    <td>
                        <asp:DropDownList ID="ddlDepartment" runat="server">
                        </asp:DropDownList>
                    </td>
                </tr>
            </table>
        </fieldset>
    </div>
    </form>

CodeBehind

Add the following namespaces:

using System.Data;
using System.Data.SqlClient;
using System.Configuration;

ConnectionString 

SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["conStr"].ConnectionString);

User Defined Functions

#region User Defined Methods
// To dynamically Bind/Fill DropDownList from Sql Server Database table, and highlight the color for flag 0 records.
protected void ddlBindDepartments() {
    SqlDataAdapter adp = new SqlDataAdapter("USP_Select_Mas_Department", con);
    adp.SelectCommand.CommandType = CommandType.StoredProcedure;
    DataSet ds = new DataSet();
    adp.Fill(ds);
    if (ds != null && ds.Tables.Count > 0 && ds.Tables[0].Rows.Count > 0) {
        ddlDepartment.DataSource = ds;
        ddlDepartment.DataValueField = "DeptId";
        ddlDepartment.DataTextField = "Department";
        ddlDepartment.DataBind();
    }

    DataView dv = ds.Tables[0].DefaultView;
    dv.RowFilter = "Status='" + false + "'";
    foreach(DataRowView dr in dv) {
        foreach(ListItem item in ddlDepartment.Items) {
            if (dr["DeptId"].ToString() == item.Value.ToString()) {
                item.Attributes.Add("style", "background-color:#3399FF;color:white;font-weight:bold;");
            }
        }
    }
}

#endregion

Page Event Handlers

#region Page Event Handlers

// Page Load
protected void Page_Load(object sender, EventArgs e) {
    ddlDepartment.SelectedIndex = -1;
    if (!Page.IsPostBack) {
        ddlBindDepartments();
    }
}

#endregion

Output

BPO, Field Technician are (Flag 0) highlighted in the following output:



I hope you enjoyed this article. Please provide your valuable suggestions and feedback.