3

我有一个设置，用户可以在其中将邮政编码输入到 ASP.NETTextBox控件中，并且我有一个AutoCompleteExtender来自 Ajax Control Toolkit 的附加到该文本框。它从 ASPX 页面上的静态页面方法获取数据。

当用户开始输入瑞士邮政编码时，例如3，然后稍等片刻，就会出现一个匹配的邮政编码列表 - 类似于：

3000 - Bern
3001 - Bern

等等。奇迹般有效。

选择显示的选项之一的正常方法是将鼠标指针移动到列表并选择您想要的，单击它或按Enter，然后将邮政编码放入该文本框（然后将城市名称放入第二个文本框）给它）。

现在，我从项目经理那里得到了一些额外的要求：

  1. 我们希望能够在Enter 不进入选项列表的情况下直接按下以选择一个 - 他只想将显示的第一个（或经常：唯一）条目放入这两个文本框...

  2. 我们希望能够输入一个有效的 4 位邮政编码，然后只需按下Tab并移出邮政编码的文本框，并选择并“选择”具有该邮政编码的第一个（可能是唯一的）条目（并填充进入两个文本框）。

对我来说似乎是一项艰巨的任务（我根本不是一个伟大的 Javascript 大师......） - 有什么想法吗？

这是我的 ASP.NET 页面（在标准 ASP.NET 4.0 webforms 示例应用程序中 - 带有母版页；脚本已简化；实际上，我3001 - Bern在破折号处拆分文本并将第一部分粘贴到 zip代码和第二部分进入城市文本框）：

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <script type="text/javascript">
        function IAmSelected(source, eventArgs) {
            $get('tbxCity').value = eventArgs.get_value();
        }
    </script>
    <asp:ScriptManager runat="server" EnablePageMethods="True" />

    <asp:Literal runat="server" ID="litPrompt" Text="Please enter zip code: " />
    <asp:TextBox runat="server" ID="tbxZipcode" MaxLength="10" />
    <act:AutoCompleteExtender runat="server" ID="acZipCode" TargetControlID="tbxZipcode" MinimumPrefixLength="1" 
                              CompletionInterval="25" ServiceMethod="GetMatchingZipCodes" CompletionSetCount="15"
                              OnClientItemSelected="IAmSelected" />
    <asp:TextBox runat="server" ID="tbxCity" MaxLength="50"  />
</asp:Content>

和我的代码隐藏（这也被简化了 - 当然，实际上，我从实体框架数据模型中获取这些数据）：

[WebMethod]
[ScriptMethod]
public static string[] GetMatchingZipCodes(string prefixText, int count)
{
   return new string[] { "3000 - Bern", "3001 - Bern", "4000 - Basel", "6000 - Lucerne", "6001 - Lucerne" };
}
4

1 回答 1

2

检查FirstRowSelectedAutoCompleteExtender 的属性。从您的要求看来，这正是您所需要的。

于 2013-02-07T09:28:28.897 回答