Monday, February 24, 2014

Set GridView Lines and Pager background color in ASP.NET 4.5

Usually, in ASP.NET 2.0, setting the GridView lines through property should work. However in 4.5, it doesn't seem to render correctly. One blog pointed out to set the gridlines through it's row data bound property as demonstrated on the code below:
Aspx Markup
 <asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1" BorderColor="Black" BorderStyle="Solid"   
     PageSize="2" AllowPaging="True" OnRowDataBound="GridView1_RowDataBound" BackColor="White"   
       CellPadding="3">  
       <FooterStyle BackColor="White" ForeColor="#000066" />  
       <HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White" />  
       <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Justify" Wrap="True" />  
       <RowStyle ForeColor="#000066" />  
       <SelectedRowStyle BorderColor="Red" BackColor="#669999" Font-Bold="True" ForeColor="White">  
       </SelectedRowStyle>  
       <SortedAscendingCellStyle BackColor="#F1F1F1" />  
       <SortedAscendingHeaderStyle BackColor="#007DBB" />  
       <SortedDescendingCellStyle BackColor="#CAC9C9" />  
       <SortedDescendingHeaderStyle BackColor="#00547E" />  
   </asp:GridView>  
   <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:GridviewConnectionString3 %>"   
     SelectCommand="SELECT * FROM [TempEmployees]">  
   </asp:SqlDataSource>  
Code Behind
Code:
        protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow || e.Row.RowType == DataControlRowType.Header)
            {
                foreach (TableCell tc in e.Row.Cells)
                {
                    tc.Attributes["style"] = "Border: 1px solid LightGray;";
                }
            }
            else
            {
                if (e.Row.RowType == DataControlRowType.Pager)
                {
                    e.Row.Cells[0].Attributes["style"] = "Border: 1px solid LightGray; background-color: #ded7d7;";
                }
            }
        }

2 comments:

  1. Hi PSYCHO GENES XD
    I've started out my "techno" blog XD please feel free to check if you have the time. HAHA

    http://techno-ob.blogspot.com

    ReplyDelete
    Replies
    1. Hi Ayisharu!

      I'll certainly add your link in my blog list. :)

      Psycho Genes

      Delete