Title: How to highlight grid view rows using jquery in asp.net
Description:
using client script we can make lot functionality on design side.Now i would like explain how to use jquery on data controls in asp.net .Whenever we have to select specified rows with particular style on client side ,the jquery can solve this task
Example:
In previous articles we have seen Bind Data to Grid view,Edit,Delete,Update in Grid view in asp.net,Import Excel to Grid view asp net.Here i will show how to Highlight grid view selected rows.
Description:
using client script we can make lot functionality on design side.Now i would like explain how to use jquery on data controls in asp.net .Whenever we have to select specified rows with particular style on client side ,the jquery can solve this task
Example:
In previous articles we have seen Bind Data to Grid view,Edit,Delete,Update in Grid view in asp.net,Import Excel to Grid view asp net.Here i will show how to Highlight grid view selected rows.
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Gridview selected Row highlight using jquery</title>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#<%=GVdynamic.UniqueID%> tr").click(function () {
$(this).css("font-weight", "bold");
$(this).css("background-color", "SkyBlue");
$(this).css("border", "2px solid Green");
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:GridView ID="GVdynamic" runat="server" AutoGenerateColumns="False"
DataSourceID="sySql">
<Columns>
<asp:BoundField DataField="DyOrderID" HeaderText="DyOrderID" />
<asp:BoundField DataField="DyOrderName" HeaderText="DyOrderName" />
<asp:BoundField DataField="DyPhone" HeaderText="Phone" />
<asp:BoundField DataField="DyAddress" HeaderText="DyAddress" />
<asp:BoundField DataField="DyAmount" HeaderText="DyAmount" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="dySql" runat="server"
ConnectionString="<%$ ConnectionStrings:Connection %>"
SelectCommand="SELECT * FROM [dyOrders]"></asp:SqlDataSource>
</form>
</body>
</html>
