GridView alternate row background color
in this example we create a sqldatasource. this data source sql command select data from products table.
then it populate a gridview. so we get a gridview with full of data. gridviews data rows are default formatted.
to provide better user experience we can assign different background color for alternate data rows. this example
demonstrate how can we set the gridview alternating data rows background color programmatically. here we assign the
gridview alternating row style back color property value salmon.
GridViewAlternateRowBackColor.aspx
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Import Namespace="System.Drawing" %>
<!DOCTYPE html>
<script runat="server">
protected void Button1_Click(object sender, System.EventArgs e)
{
GridView1.AlternatingRowStyle.BackColor = Color.Salmon;
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>How to set change GridView alternate row background color programmatically in asp.net</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color:Navy; font-style:italic;">GridView Example: Change Alternate Row BackColor</h2>
<asp:SqlDataSource
ID="SqlDataSource2"
runat="server"
ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="Select ProductID, ProductName, UnitPrice From Products"
CancelSelectOnNullParameter="false"
>
</asp:SqlDataSource>
<asp:GridView
ID="GridView1"
runat="server"
DataSourceID="SqlDataSource2"
AllowPaging="true"
BackColor="OrangeRed"
ForeColor="Snow"
BorderColor="OrangeRed"
AutoGenerateColumns="false"
Font-Names="Comic Sans MS"
Width="525"
>
<AlternatingRowStyle BackColor="Orange" />
<PagerStyle
BackColor="Crimson"
ForeColor="PeachPuff"
Font-Bold="true"
/>
<HeaderStyle
BackColor="Crimson"
Font-Italic="false"
ForeColor="Snow"
/>
<Columns>
<asp:BoundField DataField="ProductID" HeaderText="Product ID" ReadOnly="true" />
<asp:BoundField DataField="Productname" HeaderText="Product Name" />
<asp:BoundField DataField="UnitPrice" HeaderText="Unit Price" />
</Columns>
</asp:GridView>
<br /><br />
<asp:Button
ID="Button1"
runat="server"
Text="Change Alternate Row BackColor"
Font-Bold="true"
Height="45"
ForeColor="Crimson"
OnClick="Button1_Click"
/>
</div>
</form>
</body>
</html>
