在Repeater中搜索ImageButton

Question

我有TextBox：

<asp:TextBox ID="textSearch" runat="server" Width="80" ForeColor="Black" />

和Repeater ImageButtons：

<asp:Panel ID="panRepeater" runat="server" ScrollBars="Vertical">
     <asp:Repeater ID="Repeater" runat="server">
         <ItemTemplate> 
             <asp:ImageButton ID="imgSearchResult" runat="server" ImageUrl='<%# Eval("ImageUrl") %>'/> 
         </ItemTemplate>
     </asp:Repeater>
 </asp:Panel>   

在代码背后，我使用此功能将图像添加到ImageButtons：

private void LoadImages()
{
        string[] filesindirectory = Directory.GetFiles(Server.MapPath("~/Images/ORAS"));
        List<System.Web.UI.WebControls.Image> images = new List<System.Web.UI.WebControls.Image>(filesindirectory.Count());

        foreach (string item in filesindirectory)
        {
            System.Web.UI.WebControls.Image image = new System.Web.UI.WebControls.Image();
            image.ImageUrl = (String.Format("~/Images/ORAS/{0}", System.IO.Path.GetFileName(item)));
            images.Add(image);
        }

        Repeater.DataSource = images;
        Repeater.DataBind();
}

我希望能够搜索并仅显示与此示例类似的所需ImageButtons：

我会在00中输入Search-TextBox，并且会显示包含ImageButtons的所有00。问题是我必须在每KeyDown之后执行此操作。

Answer 1

这是一个复杂的场景，可以通过两种不同的方式实现。

1. 通过连接搜索文本框的服务器端文本更改事件来使用ajax回发。在此服务器端事件中，您将使用搜索文本框文本值从数据库获取记录。可以在此URL找到使用gridview的类似方案的示例：Server-side Search
2. 第二种方法，更优先的是调用服务器端方法直接从JavaScript或jquery获取记录。这可以非常快速和快速。可以在此URL找到使用gridview的此类方案的示例：Search using client-side code。

对于第二个选项，您必须连接客户端keyup事件以在从jquery对Web服务方法进行ajax调用之前获取搜索文本，并且仅在用户输入最小值时才进行搜索像2或3或4这样的字符数或任何你认为是好的数字。服务器端的Web服务方法将返回搜索项的JSON集合，以用于转发器控件。 最后，在jquery ajax调用的成功事件中，您需要使用搜索项填充转发器项。

建议

另外，作为另一个建议，让您更容易实现客户端解决方案，您可以在Web服务方法中创建一个html字符串，然后在jquery ajax调用的成功事件中，只需将div的innerHTML设置为此html，所以在jquery中，成功事件中只有一行代码会填充转发器控件。这比从Web服务返回JSON集合更容易，然后在jquery ajax调用的成功事件中，您需要使用需要一些jquery的DOM操作来创建/填充转发器控件中的html。