如何将 asp.net ajax 工具箱自动完成中的选定值添加到标签中

我使用以下 asp.net 和 C# 代码让 Ajax 工具包自动完成工作。

<form id="form1" runat="server">
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager> 
    <div>
        Search our Languages: <asp:TextBox ID="txtLanguage" runat="server"></asp:TextBox>
        <asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" 
            TargetControlID="txtLanguage" MinimumPrefixLength="1" 
            ServiceMethod="GetCompletionList" UseContextKey="True">
        </asp:AutoCompleteExtender>
        <br />
        <br />
        <asp:Button ID="btnAddSelected" runat="server" Text="Add to chosen Languages >" 
            onclick="btnAddSelected_Click" />
        <br />
        <br />
        <asp:Label ID="lblSelectedLanguages" runat="server" Text=""></asp:Label>
    </div>
</form>

这是我的代码隐藏 C#：

[System.Web.Services.WebMethodAttribute(), System.Web.Script.Services.ScriptMethodAttribute()]
public static string[] GetCompletionList(string prefixText, int count, string contextKey)
{
    // Create array of languages. 
    string[] languages = { "Afrikaans", "Albanian", "Amharic", "Arabic", "Azerbaijani", "Basque", "Belarusian", "Bengali", "Bosnian", "Bulgarian" };
    // Return matching languages. 
    return (from l in languages where l.StartsWith(prefixText, StringComparison.CurrentCultureIgnoreCase) select l).Take(count).ToArray();
}
protected void btnAddSelected_Click(object sender, EventArgs e)
{
    lblSelectedLanguages.Text += txtLanguage.Text += ", ";
}

单击按钮时，所选语言将添加到标签中，但是我想删除按钮并使用 Ajax 工具包中的部分回发自动将自动完成中的选定项添加到标签中。

有人可以建议我如何实现这一目标吗？

谢谢。

处理自动完成扩展器控件上的OnClientItemSelected以运行 JavaScript 函数
javascript 所做的只是在进行选择时简单地触发 TextChanged 事件（适用于 Enter 和左键单击）

.ASPX：

<head runat="server">
    <title></title>
    <script type="text/javascript">
        function ItemSelected(sender, args) {
            __doPostBack(sender.get_element().name, "");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            Search our Languages:&nbsp;
            <asp:TextBox ID="txtLanguage" autocomplete="off" runat="server" OnTextChanged="TextChanged" />
            <asp:AutoCompleteExtender OnClientItemSelected="ItemSelected" ID="AutoCompleteExtender1"
                runat="server" TargetControlID="txtLanguage" MinimumPrefixLength="1" ServiceMethod="GetCompletionList"
                UseContextKey="True">
            </asp:AutoCompleteExtender>
            <br />
            <asp:Label ID="lblSelectedLanguages" runat="server"></asp:Label>
        </ContentTemplate>
    </asp:UpdatePanel>
    </form>
</body>

代码隐藏：

protected void TextChanged(object sender, EventArgs e)
{
    lblSelectedLanguages.Text += txtLanguage.Text += ", ";
}

看起来你只需要挂接到文本框的 on text changed 事件，然后将你的逻辑放在代码 Benind。像这样的东西

标记

<asp:TextBox ID="txtLanguage" OnTextChanged="txtLanguage_textChanged" AutoPostback="true" />

然后在你的代码隐藏中

  protected void txtLanguage_textChanged(object sender, EventArgs e)
  {
      //use  the retrieved text the way you like
       lblSelectedLanguages.Text =txtLanguage.Text;
   }

希望这有帮助。我还建议您尝试查看JQuery自动完成小部件。它给我带来了纯粹的幸福，我确实与自动完成扩展器离婚了。Jquery Autocomplete

相关内容

最新更新

热门标签：