IN THE ASPX PAGE
<html>
<head runat="server">
<%-- Jquery link --%>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<%-- Script --%>
<script type="text/javascript">
$(document).ready(function () {
$('#txtcatsearch').keyup(function (event) {
var searchKey = $(this).val().toLowerCase();
<%--3 is the column name in the gridview used to search --%>
$("#catgridview tr td:nth-child(3)").each(function () {
var cellText = $(this).text().toLowerCase();
if (cellText.indexOf(searchKey) >= 0) {
$(this).parent().show();
}
else {
$(this).parent().hide();
}
});
});
});
</script>
</head>
<body>
<asp:TextBox ID="txtcatsearch" runat="server"></asp:TextBox>
<asp:GridView ID="catgridview" runat="server">
</asp:GridView><%-- Fill the gridview using either databind in the cs page or by anyother type --%>
</body>
</html>
<html>
<head runat="server">
<%-- Jquery link --%>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<%-- Script --%>
<script type="text/javascript">
$(document).ready(function () {
$('#txtcatsearch').keyup(function (event) {
var searchKey = $(this).val().toLowerCase();
<%--3 is the column name in the gridview used to search --%>
$("#catgridview tr td:nth-child(3)").each(function () {
var cellText = $(this).text().toLowerCase();
if (cellText.indexOf(searchKey) >= 0) {
$(this).parent().show();
}
else {
$(this).parent().hide();
}
});
});
});
</script>
</head>
<body>
<asp:TextBox ID="txtcatsearch" runat="server"></asp:TextBox>
<asp:GridView ID="catgridview" runat="server">
</asp:GridView><%-- Fill the gridview using either databind in the cs page or by anyother type --%>
</body>
</html>