Introduction:
Here I will explain how dynamically change gridview row background color based on condition in asp.net using css classes in c#, vb.net with example or dynamically change asp.net gridview row background color based on condition in c#, vb.net with example.
Description:
In previous articles I explained edit gridview row details with ajax modalpopup, show sum of columns total in gridview footer, filter asp.net gridview based on dropdown selection, Repeater Control Example in asp.net, sorting columns in repeater control in asp.net, Display time like facebook/twitter like 1 minute ago, hour ago and many articles relating to gridview in asp.net, css, c#, vb.net and jQuery. Now I will explain how to change gridview row background color dynamically on condition in asp.net using css in c#, vb.net with example.
In previous articles I explained edit gridview row details with ajax modalpopup, show sum of columns total in gridview footer, filter asp.net gridview based on dropdown selection, Repeater Control Example in asp.net, sorting columns in repeater control in asp.net, Display time like facebook/twitter like 1 minute ago, hour ago and many articles relating to gridview in asp.net, css, c#, vb.net and jQuery. Now I will explain how to change gridview row background color dynamically on condition in asp.net using css in c#, vb.net with example.
To
implement this first
we need to write the code following code in your aspx page
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title> Dynamically change
GridView Row Background Color based on condition in ASP.Net using C# and
VB.Net</title>
<style type="text/css">
body
{
font-family:Calibri;
}
.btechcss
{
background:#df5015;
font-weight:bold;
color:White;
}
.mscss
{
background:Green;
font-weight:bold;
color:White;
}
</style>
</head>
<body>
<form id="form1"
runat="server">
<div>
<asp:GridView ID="gvDetails"
runat="server"
OnRowDataBound="gvDetails_RowDataBound">
</asp:GridView>
</div>
</form>
</body>
</html>
|
Now open code behind file and add following
namespaces
C#
Code
using System;
using System.Data;
using
System.Web.UI.WebControls;
|
Now write the following code in your application to
bind gridview and change background row color based on conditions
protected void Page_Load(object
sender, EventArgs e)
{
if (!IsPostBack)
BindGridview();
}
private void BindGridview()
{
DataTable dt = new DataTable();
dt.Columns.Add("UserId",
typeof(Int32));
dt.Columns.Add("UserName",
typeof(string));
dt.Columns.Add("Education",
typeof(string));
dt.Rows.Add(1, "Suresh
Dasari", "B.Tech");
dt.Rows.Add(2, "Rohini
Dasari", "Msc");
dt.Rows.Add(3, "Madhav Sai",
"Ms");
dt.Rows.Add(4, "Praveen",
"B.Tech");
dt.Rows.Add(6, "Sateesh",
"MD");
dt.Rows.Add(7, "Mahesh
Dasari", "B.Tech");
dt.Rows.Add(8, "Mahendra",
"CA");
gvDetails.DataSource = dt;
gvDetails.DataBind();
}
protected void gvDetails_RowDataBound(object sender, GridViewRowEventArgs
e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
foreach (TableCell row in
e.Row.Cells)
{
if (e.Row.Cells[2].Text == "B.Tech")
{
row.CssClass = "btechcss";
}
if (e.Row.Cells[2].Text.Contains("Ms"))
{
row.CssClass = "mscss";
}
}
}
}
|
VB.NET
Code
Imports System.Data
Imports
System.Web.UI.WebControls
Partial Class VBCode
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal
sender As Object,
ByVal e As EventArgs) Handles
Me.Load
If Not
IsPostBack Then
BindGridview()
End If
End Sub
Private Sub BindGridview()
Dim dt As New DataTable()
dt.Columns.Add("UserId",
GetType(Int32))
dt.Columns.Add("UserName",
GetType(String))
dt.Columns.Add("Education",
GetType(String))
dt.Rows.Add(1, "Suresh
Dasari", "B.Tech")
dt.Rows.Add(2, "Rohini
Dasari", "Msc")
dt.Rows.Add(3, "Madhav Sai",
"Ms")
dt.Rows.Add(4, "Praveen",
"B.Tech")
dt.Rows.Add(6, "Sateesh",
"MD")
dt.Rows.Add(7, "Mahesh
Dasari", "B.Tech")
dt.Rows.Add(8, "Mahendra",
"CA")
gvDetails.DataSource = dt
gvDetails.DataBind()
End Sub
Protected Sub gvDetails_RowDataBound(ByVal
sender As Object,
ByVal e As GridViewRowEventArgs)
If e.Row.RowType = DataControlRowType.DataRow
Then
For Each row As TableCell In
e.Row.Cells
If e.Row.Cells(2).Text = "B.Tech" Then
row.CssClass = "btechcss"
End If
If e.Row.Cells(2).Text.Contains("Ms") Then
row.CssClass = "mscss"
End If
Next
End If
End Sub
End Class
|
Demo
 |
Download
Sample Attached
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
1 comments :
Simple & bset
Note: Only a member of this blog may post a comment.