Question

我正在开发一个用于数据输入的ASP.NET表单。用户必须从下拉列表中选择一个充满大约1000个客户端的客户端。

现在客户端列表正在增长，并且用户已经请求我添加查找功能：他们想要键入部分名称并使用名称匹配的客户端过滤下拉列表。因此，如果他们输入“aaa”，他们只希望在他们名字的某个地方看到“aaa”的客户。

我查看了ajax控件工具包的AutoComplete，但它适用于文本框，而不是下拉列表。

有人能提出一个很好的解决方案吗？

Answer 1

然后在文本框中使用它！当然，查看下拉列表的人知道客户的名称。在我看来，在这种情况下，没有什么区别。

我一直在使用jQuery标签建议添加我的MVC应用程序，它运行得很好。

http://remysharp.com/2007/12/28/jquery-tag-suggestion/

如果您对评论感兴趣，我将为您提供我正在使用的代码。

如果您确实想使用下拉列表，则可以在更新面板中显示文本框和下拉列表。当用户输入文本（并单击按钮）时，您可以使用过滤到用户输入内容的结果填充下拉列表。

Answer 2

我认为文本框实际上是首选。一个选择框不会邀请输入 - 所以它会成为一个隐藏的技巧来过滤它（更不用说Firefox无论如何都会做得很好）。

您可以轻松地将图像放在文本框旁边，以指示它有选项，允许鼠标驱动或键盘驱动的交互。

我偏爱JQuery，因此我使用JQuery's autocomplete - 其配置选项需要匹配，或者单击该框将删除所有项目。

如果您对“渐进增强”感兴趣，那么您可能最好使用传统的选择输入（用于辅助功能），该输入由相同数据驱动的自动完成文本框替换。类似的东西：

<select id="s">
   <option value="foo">Foo</value>
   <option value="bar">Bar</value>
</select>

var d = $('#s OPTION').map(function() {
   return $(this).text();
});

$('#s').hide().append('<input type="text" />')
   .autocomplete(d, {
        mustMatch: true,
        minChars: 0,
        autoFill: true,
        matchContains: false
    })
    .result(function(e, d, f) {
       // Select option for the form to submit
       $('#s').val(d);
    });

你也可以保持选择可见 - 这使得它更灵活，但可能更令人困惑 - 并将事件处理程序挂钩到选择框以更新文本框，以便它们保持同步。

为用户提供过滤下拉列表的搜索功能

2 个答案: