asp.net 中的列表框自动填充功能

Posted

技术标签:

【中文标题】asp.net 中的列表框自动填充功能【英文标题】:Autofill feature with Listbox in asp.net 【发布时间】:2013-01-03 03:05:48 【问题描述】:

我有一个列表框,其中的项目是从数据库表中加载的“名字”,

    现在我想要一个自动填充功能,如果用户键入“a”,所有以“a”开头的名字都应该显示在列表框中 点击某个按钮后,原始数据应重新填充到列表框中

对于第二个,即重新填充希望我可以用下面的代码做

protected void btnRePopulate_Click(object sender, EventArgs e)

    DataSet oDs = ReadDataSet();
    Listbox1.DataTextField = "Name";
    Listbox1.DataValueField = "ID";
    Listbox1.DataSource = oDs;
    Listbox1.DataBind();

但是对于第一个我有一些我正在工作的事情(我正在使用文本框 keyup 事件在用户键入“a”或其他内容时触发)

    清除列表框并添加以“a”开头的名称,但不确定是否可以从客户端进行 或设置另一个可见的列表框,名称从原始列表框过滤并隐藏原始列表框,我无法从 js 或代码隐藏设置可见属性 不,我不想使用 ajax 自动填充

除了以上两种,还有更好的选择吗...

【问题讨论】:

您可能需要在东输入三个字符才能从数据库中获取与“开头为”表达式匹配的项目列表。 感谢您的回复...是的,您是绝对正确的,即使我想到了,但由于我已经有记录,即在列表框中,我是否需要再次往返用于过滤我已经拥有的记录的数据库... 或者有没有办法从 java 脚本中访问数据集,它完全获取,使用它我可以从 java 脚本中过滤数据..任何想法的家伙.... 【参考方案1】:

这种过滤和重置最好在客户端本身完成。这样您就不会进行不必要的服务器调用。这是jQuery中的扩展方法。

$(function() 
  $('#select').filterByText($('#textbox'), true);
); 

扩展方法:

jQuery.fn.filterByText = function(textbox, selectSingleMatch) 
  return this.each(function() 
    var select = this;
    var options = [];
    $(select).find('option').each(function() 
      options.push(value: $(this).val(), text: $(this).text());
    );
    $(select).data('options', options);
    $(textbox).bind('change keyup', function() 
      var options = $(select).empty().scrollTop(0).data('options');
      var search = $.trim($(this).val());
      var regex = new RegExp(search,'gi');

      $.each(options, function(i) 
        var option = options[i];
        if(option.text.match(regex) !== null) 
          $(select).append(
             $('<option>').text(option.text).val(option.value)
          );
        
      );
      if (selectSingleMatch === true && 
          $(select).children().length === 1) 
        $(select).children().get(0).selected = true;
      
    );
  );
;

我在 Lessan Vaezi 的博客上发现了这一点,并通过 live demo 了解如何操作。

【讨论】:

谢谢老兄,会试一试;)

以上是关于asp.net 中的列表框自动填充功能的主要内容,如果未能解决你的问题,请参考以下文章

根据在另一个文本框中键入的文本,使用 AJAX 更新面板在 ASP.NET 中自动填充文本框

如何使用 Chrome 浏览器在 ASP.Net 中停止将输入类型自动填充为密码

根据用户输入自动填充文本框

如何根据 asp.net mvc4 中的模型列表填充 ListBox?

在 asp.net webform 中比较和删除列表框中的项目

ASP.NET 部分回发上的 Chrome 自动填充(更新面板)