First of all we need to define a style class to highlight the row by clicking we can do it in header section of the page
<style>
.selectedRow {
background-color: yellowgreen !important;
}
</style>
then here is our JavaScript function
<script type="text/javascript">
function pageLoad(sender, args) {
$('#<%=grdBatch.ClientID %>').delegate('tr', 'click', function () {
$('#<%=grdBatch.ClientID %> tr').not(this).removeClass('selectedRow');
$(this).toggleClass('selectedRow');
});
}
</script>
here is the gridview control
<asp:GridView ID="grdBatch"
runat="server"
ShowHeader="true"
AutoGenerateColumns="False"
ItemType="DataModel.Student"
EmptyDataText="No records found"
Width="100%"
>
<Columns>
<asp:BoundField DataField="Name" HeaderText="Name" HeaderStyle-CssClass="first" ItemStyle-CssClass="first">
<HeaderStyle HorizontalAlign="Left" />
</asp:BoundField>
</Columns>
</asp:GridView>