当前位置：文江博客话题详情

Asp.net为ListView控件实现搜索功能

发布于 2024-11-09 06:04:42 字数 132 浏览 0 评论 0原文

我有一个 ListView，其中包含编辑、删除和添加。这里一切都很好，但是列表太大，我想为用户提供带有文本框和按钮的搜索功能。

当用户单击搜索按钮时，列表视图将按搜索条件进行过滤。

有人可以帮助我实现这一目标吗？谢谢

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

月依秋水 2024-11-16 06:04:42

（回应这个问题的评论...）

很大程度上取决于你的 DOM 结构。您需要知道 ListView 如何布置其元素。例如，如果它们都是 div 元素，那么您需要了解 JavaScript 代码的情况。（我将假设使用 jQuery，因为现在这是一个安全的假设。）

本质上，您的过滤器将至少有一个文本输入元素：

<input type="text" id="searchFilter" />

您还可以有一个按钮来使用过滤器，但为了简洁起见让我们根据用户输入进行过滤：

$(document).ready(function() {
  $('#searchFilter').keyup(function() {
    // Here you would do your filtering.
  });
});

对于过滤本身，您可以使用 :contains() 选择器。请在此处查看相关信息。基本上，您会隐藏所有元素，然后显示匹配的元素。像这样的东西（未经测试）：

$('#parentDiv div').hide();
$('#parentDiv div:contains(' + $('#searchFilter').val() + ')').show();

这个想法是隐藏所有子 div（您的选择器可能需要更具体，具体取决于您的 DOM），然后显示与过滤器匹配的子 div。当然，不要忘记有一个默认情况，如果过滤器文本为空，则显示所有内容。

(In response to the comments on the question...)

Depends a lot on your DOM structure. You'll need to know how the ListView has laid out its elements. For example, if they're all div elements then you'll need to know that for your JavaScript code. (I'm going to assume the use of jQuery, because it's a safe assumption these days.)

Essentially, your filter is going to have at least a text input element:

<input type="text" id="searchFilter" />

You can also have a button to engage the filter, but for brevity let's just filter as the user types:

$(document).ready(function() {
  $('#searchFilter').keyup(function() {
    // Here you would do your filtering.
  });
});

For the filtering itself, you could use the :contains() selector. See information about it here. Basically, you'd hide all of the elements and then show the ones which match. Something like this (untested):

$('#parentDiv div').hide();
$('#parentDiv div:contains(' + $('#searchFilter').val() + ')').show();

The idea is to hide all of the child divs (your selectors may need to be more specific, depending on your DOM) and then show the ones which match the filter. Don't forget, of course, to have a default case to show all if the filter text is empty.

回复收藏 0 原文

时光病人 2024-11-16 06:04:42

嗯，你必须了解你的底层结构；假设您正在渲染一个表格，您需要编写 JavaScript 来循环每一行并执行以下操作：

$("#table").find("tbody > tr").each(function() {
    var row = this;
    //loop through the cells, do the string match
    var tds = $(this).find("td");
    //match the inner HTML of the td to the search criteria, depending on how
    //your search critiera is setup        

    //if not found
    $(this).css("display", "none"); //hide the row
});

Well, you have to know your underlying structure; say you are rendering a table, you need to write JavaScript to loop through each row and do something like:

$("#table").find("tbody > tr").each(function() {
    var row = this;
    //loop through the cells, do the string match
    var tds = $(this).find("td");
    //match the inner HTML of the td to the search criteria, depending on how
    //your search critiera is setup        

    //if not found
    $(this).css("display", "none"); //hide the row
});

回复收藏 0 原文

鹿童谣 2024-11-16 06:04:42

这取决于你如何渲染 ListView，但如果你渲染一个表格并想要在客户端进行过滤，你可以使用 jQuery 插件，例如 UI表格过滤器

回复收藏 0 原文

水溶 2024-11-16 06:04:42

最终使用了这个：

protected void btnSearch_Click(object sender, EventArgs e)
{
    DS.SelectCommand = 
      "SELECT ReportName, ReportType, 
       FROM Table 
       WHERE ReportName LIKE @param 
       ORDER BY ReportType Desc";
   DS.SelectParameters.Add("Param", searchTxtBox.Text.Replace("'", "''"));
   DS.DataBind();
   ListView1.DataBind();               
}

ended up using this:

protected void btnSearch_Click(object sender, EventArgs e)
{
    DS.SelectCommand = 
      "SELECT ReportName, ReportType, 
       FROM Table 
       WHERE ReportName LIKE @param 
       ORDER BY ReportType Desc";
   DS.SelectParameters.Add("Param", searchTxtBox.Text.Replace("'", "''"));
   DS.DataBind();
   ListView1.DataBind();               
}

回复收藏 0 原文

~没有更多了~