Show border for the selected row in GridView


I have seen a solution provided by Mike Banavige in this thread(http://forums.asp.net/p/1211169/2134768.aspx#2134768).

Here is a variation of that solution for selected row with the addition of OnPreRender event:

Define CSS classes for the border of selected row’s cells and add the CSS classes in the OnPreRender event.

<head runat="server">
<title>SamplePage</title>
<style type="text/css">

.selectedRow td{border-top:3px solid yellow;border-bottom:3px solid yellow;}
.selectedRow td.first {border-left:3px solid yellow;}
.selectedRow td.last {border-right:3px solid yellow;}
   </style>
</head>

<asp:GridView ID="GridView1" runat="server" OnPreRender="GridView1_OnPreRender" …>

Code:

 protected void GridView1_OnPreRender(object sender, EventArgs e)
    {
        GridView gv = (GridView)sender;
       
        gv.Style["border-collapse"] = "seperate"; //add seperate to the style
        gv.Columns[0].ItemStyle.CssClass = "first";
        gv.Columns[gv.Columns.Count - 1].ItemStyle.CssClass = "last";
        gv.SelectedRowStyle.CssClass = "selectedRow";
       
    }
(Copied from this thread: http://forums.asp.net/t/1212856.aspx)

Advertisements


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s