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
|