Saturday, June 8, 2013

Jquery highlight Gridview selected rows in

Title: How to highlight grid view rows using jquery in

using client script we can make lot functionality on design side.Now i would like explain how to use jquery on data controls in .Whenever we have to select specified rows with particular style on client side ,the jquery can solve this task

In previous articles we have seen Bind Data to Grid view,Edit,Delete,Update in Grid view in,Import Excel to Grid view asp net.Here i will show how to Highlight grid view selected rows.
<html xmlns="">
<head id="Head1" runat="server">
<title>Gridview selected Row highlight using jquery</title>
<script src="" 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");
<form id="form1" runat="server">
<asp:GridView ID="GVdynamic" runat="server" AutoGenerateColumns="False"
<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" />
<asp:SqlDataSource ID="dySql" runat="server"
    ConnectionString="<%$ ConnectionStrings:Connection %>"
    SelectCommand="SELECT * FROM [dyOrders]"></asp:SqlDataSource>

No comments: