Question

我目前在我的ASP.Net C＃2.0网站上有一个数据绑定下拉列表，里面有大约400个项目。我想用类似谷歌搜索中的文本框替换它来输入字母，只弹出以这些字母开头的条目

实施它的好方法是什么？是否存在任何人都可以建议的控件？

Answer 1

查看http://docs.jquery.com/Plugins/Autocomplete

这里还有一个tutorial用于ASP.Net

Answer 2

使用HTML5（当然是针对小型数据集）的一种方法是datalist：

<input list="users" name="users">
  <datalist id="users">
    <option value="Alice">
    <option value="Bob">
    <option value="Chuck">
    <option value="Chris">
    <option value="Duke">
    <option value="Emily">
  </datalist>

对于较大的数据集，AJAX是一种更好的方法。

Answer 3

检查完整。

http://complete-ly.appspot.com/

它没有依赖性和权重很少。

Answer 4

如果这些是已知的enrties，您可以使用JQuery，并在OnUpdate事件上：

如果它是一个很长的列表，请向您的网络服务器发出Ajax请求，检索最佳选项
如果它是一个简短列表，您可以将所有选项加载到页面，并提供可选文本而无需提出服务器请求。

查看JQuery库以获取有关如何显示建议的实现。

Answer 5

有一个AutoComplete扩展程序作为AJAX Control Toolkit for ASP.NET的过去。您可以为客户端缓存设置许多不同的选项，延迟间隔。只需将其指向Web服务或页面方法即可离开。

Answer 6

TextBoxValueToDropDownList

    function AddNames(text) {

        if (document.myForm.insertText.value == "") {
            document.getElementById("insertText").style.border = "1px solid red";
            return false;
        }
        else {
            var option = document.createElement("OPTION");
            option.text = text.value;
            option.value = text.value;
            document.getElementById("dropDownList").options.add(option);
            document.myForm.insertText.value = "";
            document.getElementById("insertText").style.border = "1px solid green";
        }
    }




    <form name="myForm">
        <table>
            <tr>
                <td>
                    <input type="text" name="insertText" id="insertText" /></td>
                <td></td>
                <td>
                    <select name="dropDown" id="dropDownList">
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" value="Insert" id="button" onclick="AddNames(insertText);" /></td>
            </tr>
        </table>
    </form>

带下拉建议的文本框

6 个答案: