CODEDIGEST
Home » CodeDigest
Search
 

Technologies
 

Highlight GridView Row When Checkbox is checked in GridView using JQuery in Asp.Net
Submitted By Satheesh Babu B
On 12/19/2008 8:17:32 AM
Tags: asp.net,CodeDigest,JQuery  

My previous code snippets Check All Checkboxes in GridView using JQuery and Check All Checkboxes in a Particular Column in GridView using JQuery helped us to achieve select all rows functionality in Asp.Net GridView.

 

The following code snippet will highlight the current row if the checkbox in the current is checked.

 

<script language="javascript">

function Highlight(chk) {

if (chk.checked) {

 $("#" + chk.id).parent("td").parent("tr").css("background-color", "Red");

}else

{

$("#" + chk.id).parent("td").parent("tr").css("background-color", "white");

}

}

</script>

 

 

<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="False" BackColor="White" BorderColor="#010101" BorderStyle="Groove" BorderWidth="1px" CellPadding="4">

<Columns>

  <asp:TemplateField HeaderText="Roles">

     <HeaderTemplate>

         <asp:CheckBox ID="chkAll" onclick="javascript:SelectAllCheckboxes(this);" runat="server" />

     </HeaderTemplate>

      <ItemTemplate>

        <asp:CheckBox onclick="javascript:HighlightRow(this);" ID="chkDelete" runat="server" />

     </ItemTemplate>

   </asp:TemplateField>

 <asp:BoundField DataField="Email" HeaderText="Email" ReadOnly="True" />

 <asp:BoundField DataField="FirstName" HeaderText="First Name" ReadOnly="True" />

 <asp:BoundField DataField="LastName" HeaderText="Last Name" ReadOnly="True" />

</Columns>

<FooterStyle BackColor="White" ForeColor="#330099" />

<RowStyle BackColor="White" ForeColor="#330099" />

<HeaderStyle BackColor="#F06300" Font-Bold="True" ForeColor="#FFFFCC" />

</asp:GridView>

 

 

The following article will help you to do this in JavaScript.

 

Select All and Highlight Selected Row

Do you have a working code that can be used by anyone? Submit it here. It may help someone in the community!!

Recent Codes
  • View All Codes..