c# - ASP.NET - 基于文本框按键的客户端 Gridview 数据过滤

Question

我想在 gridview 上执行客户端数据搜索过程，以加快加载速度和性能(GV 上的数据正在通过存储过程加载)

我已将其视为来源并尝试遵循代码，但它不起作用。有什么问题吗？ Filter records in gridview http://www.vonloesch.de/comment/reply/23

这是我得到的

function filter2(phrase, _id) {
    var words = phrase.value.toLowerCase().split(" ");
    var table = document.getElementById(_id);
    var ele;
    for (var r = 1; r < table.rows.length; r++) {
        ele = table.rows[r].innerHTML.replace(/<[^>]+>/g, "");
        var displayStyle = 'none';
        for (var i = 0; i < words.length; i++) {
            if (ele.toLowerCase().indexOf(words[i]) >= 0)
                displayStyle = '';
            else {
                displayStyle = 'none';
                break;
            }
        }
        table.rows[r].style.display = displayStyle;
    }
}

---

     <!-- A text box for entering search phrase and GridView1.ClientID returns the client id of gridview -->
 <input name="txtTerm" onkeyup="filter2(this, '<%=grdLocation %>')" type="text">

---

             <div class="ModalBodyGridview">

      <asp:GridView ID="grdLocation"  runat="server" AutoGenerateColumns="false" BackColor="White" BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px" CellPadding="4" DataSourceID="SqlDataSource2" ForeColor="Black" GridLines="Vertical" Width="420px" OnSelectedIndexChanged="grdLocation_SelectedIndexChanged" ShowHeaderWhenEmpty="True" EmptyDataText="No records Found" >
   <AlternatingRowStyle BackColor="White" />
  <Columns>
      <asp:CommandField ShowSelectButton="True" />
     <asp:BoundField DataField="Location Num" HeaderText="Location Num" SortExpression="Location Num" />
      <asp:BoundField DataField="Location Name" HeaderText="Location Name" SortExpression="Location Name" />
   </Columns>
        <FooterStyle BackColor="#CCCC99" />
        <HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
        <PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
         <RowStyle BackColor="#F7F7DE" />
        <SelectedRowStyle BackColor="green" Font-Bold="True" ForeColor="White" />
        <SortedAscendingCellStyle BackColor="#FBFBF2" />
        <SortedAscendingHeaderStyle BackColor="#848384" />
        <SortedDescendingCellStyle BackColor="#EAEAD3" />
        <SortedDescendingHeaderStyle BackColor="#575357" />
      </asp:GridView>


     <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:RPSMSConnectionString %>" SelectCommand="spSearchLoc" SelectCommandType="StoredProcedure"></asp:SqlDataSource>
    </div>

或者如果有人可以提出其他解决方案，我们将不胜感激。

Answer 1

您应该将 ClientID 传递给您拥有的 JavaScript 函数。因为您的 GridView 的 ID 在客户端呈现后会有所不同。

试试这个

<input name="txtTerm" onkeyup="filter2(this, '<%=grdLocation.ClientID %>')" type="text">