C# GridView - How to change Cell Color based on different values?
C# - Change cell color on different values in Gridview
In my previous post I explained about to Export C# Datatable to Excel Spreadsheet Css Style - Sample Application. In this post we will see how to change cell color based on different values in ASP .Net Grid View control. Find the source code below:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>C# GridView - How to
change Cell Color based on different values?</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound" AutoGenerateColumns="False" CellPadding="4" ForeColor="#333333" GridLines="None">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<Columns>
<asp:TemplateField HeaderText="Serial
No">
<ItemTemplate>
<asp:Label ID="lblId" runat="server" Text='<%#Container.DataItemIndex
+ 1 %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Department" HeaderText="Department" />
<asp:BoundField DataField="Color" HeaderText="Color" />
</Columns>
<EditRowStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#E9E7E2" />
<SortedAscendingHeaderStyle BackColor="#506C8C" />
<SortedDescendingCellStyle BackColor="#FFFDF8" />
<SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
</div>
<br />
<asp:Button ID="btnGetVal" runat="server" Text="Get
Value"
OnClick="btnGetVal_Click" />
</form>
</body>
</html>
Default.aspx.cs
using System;
using
System.Collections.Generic;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.UI;
using
System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindData();
}
}
private void BindData()
{
DataTable dt = new DataTable();
dt.Columns.Add("Department", typeof(string));
// Here we add five
DataRows.
dt.Rows.Add("Software");
dt.Rows.Add("Accounts");
dt.Rows.Add("IT");
dt.Rows.Add("HR");
dt.Rows.Add("GIS");
try
{
DataColumn col = new DataColumn("Color", typeof(Int32));
dt.Columns.Add(col);
GridView1.DataSource = dt;
GridView1.DataBind();
}
catch (Exception ex)
{
}
}
protected void
GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
int quantity = int.Parse(((Label)e.Row.FindControl("lblId")).Text);
switch (quantity)
{
case 1:
e.Row.Cells[2].BackColor =
System.Drawing.ColorTranslator.FromHtml("#FF0000");
break;
case 2:
e.Row.Cells[2].BackColor =
System.Drawing.ColorTranslator.FromHtml("#00FFFF");
break;
case 3:
e.Row.Cells[2].BackColor =
System.Drawing.ColorTranslator.FromHtml("#0000FF");
break;
case 4:
e.Row.Cells[2].BackColor =
System.Drawing.ColorTranslator.FromHtml("#FFA500");
break;
case 5:
e.Row.Cells[2].BackColor =
System.Drawing.ColorTranslator.FromHtml("#FFFF00");
break;
}
}
}
protected void btnGetVal_Click(object sender, EventArgs e)
{
string sno = string.Empty;
string col = string.Empty;
foreach (GridViewRow grd in GridView1.Rows)
{
string id = (((Label)grd.FindControl("lblId")).Text.ToString());
sno = id + ",";
string color = "#" +
grd.Cells[2].BackColor.Name.Substring(2);
col = color + ",";
Response.Write(sno);
Response.Write(col);
}
}
}
Please leave your comments, suggestions and queries about this post in the comment sections in order for me to improve my writing skills and to showcase more useful posts. Thanks for reading .. :)
Download the source code click here
C# GridView - How to change Cell Color based on different values?
Reviewed by Ravi Kumar
on
10:46 AM
Rating:
Reviewed by Ravi Kumar
on
10:46 AM
Rating:
No comments: