Question

我正在尝试在我的asp.net应用程序中实现jquery quicksearch插件。下面的代码在ASP.NET GridView中工作，但不在ASP.NET表中。请帮忙

我有一个ASP.NET表，我希望实时过滤/搜索文本框上keydown / textchange事件的表行。每当我在文本框中键入内容时，如果表格中存在特定文本，则只应显示该特定行。

请帮忙...... 我的项目将在9天内上线。



<script type="text/javascript">
		    $(function () {
		        $('input#id_search').quicksearch('table#Table1 tbody tr');
             })
    </script>
<script src="scripts/jquery-1.4.1-vsdoc.js"></script>
<script src="scripts/jquery-1.4.1.js"></script>
<script src="scripts/jquery-1.4.1.min.js"></script>
<script src="scripts/jquery.quicksearch.js"></script>

<form runat="server">
  <div>
    <input id=id_search type=text placeholder="Search" />
  </div>
  <div>
     <asp:Table ID="Table1" runat="server" ClientIDMode="Static"  CssClass="table table-responsive">
       <asp:TableHeaderRow>
         
          <asp:TableHeaderCell Text="Block"></asp:TableHeaderCell>
		  <asp:TableHeaderCell Text="Flat"></asp:TableHeaderCell>
          <asp:TableHeaderCell Text="Name"></asp:TableHeaderCell>
         
       </asp:TableHeaderRow>
       
             <asp:TableRow>
                 <asp:TableCell Text="B-Wing"></asp:TableCell>
                 <asp:TableCell Text="101"></asp:TableCell>
                 <asp:TableCell Text="ABC"></asp:TableCell>
             </asp:TableRow>
       
             <asp:TableRow>
                 <asp:TableCell Text="A-wing"></asp:TableCell>
                 <asp:TableCell Text="102"></asp:TableCell>
                 <asp:TableCell Text="DEF"></asp:TableCell>
            </asp:TableRow>
       
    </asp:Table>
  </div>
  </form>

Answer 1

Tbody未生成...另请查看以下jquery参考

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js" type="text/javascript"></script>

<script>


    $(document).ready(function () {
        $('input#id_search').quicksearch('table#Table1 tr');
    });

    </script>

编辑：在我的机器上运行的页面的完整源代码确保脚本存在于其位置。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ControlTest.WebForm1" %>

<%@ Register Assembly="ControlTest" Namespace="ControlTest" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js" type="text/javascript"></script>


<%--<script src="Scripts/jquery-2.1.0.js" type="text/javascript"></script>--%>

<script src="jquery.quicksearch.js"></script>

</head>
<body>
    <form id="form1" runat="server">


  <div>
    <input id=id_search type=text placeholder="Search" />
  </div>
  <div>
     <asp:Table ID="Table1" runat="server" ClientIDMode="Static"  CssClass="table table-responsive">
       <asp:TableHeaderRow>

          <asp:TableHeaderCell Text="Block"></asp:TableHeaderCell>
          <asp:TableHeaderCell Text="Flat"></asp:TableHeaderCell>
          <asp:TableHeaderCell Text="Name"></asp:TableHeaderCell>

       </asp:TableHeaderRow>

             <asp:TableRow>
                 <asp:TableCell Text="B-Wing"></asp:TableCell>
                 <asp:TableCell Text="101"></asp:TableCell>
                 <asp:TableCell Text="ABC"></asp:TableCell>
             </asp:TableRow>

             <asp:TableRow>
                 <asp:TableCell Text="A-wing"></asp:TableCell>
                 <asp:TableCell Text="102"></asp:TableCell>
                 <asp:TableCell Text="DEF"></asp:TableCell>
            </asp:TableRow>

    </asp:Table>
  </div>


<script>


    $(document).ready(function () {
        //$('input#id_search').quicksearch('table#Table1 tr');
        $('input#id_search').quicksearch('table#Table1 tr');
    });
            //
    </script>



    </form>
</body>
</html>

在asp.net表中使用jquery quicksearch插件的Quicksearch

1 个答案: