2

我使用以下 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 工具包的部分回发自动将自动完成中的选定项目添加到标签中。

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

谢谢。

4

2 回答 2

3
  1. 处理OnClientItemSelectedAutoCompleteExtender 控件以运行 javascript 函数
  2. 所有 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 += ", ";
}
于 2013-01-25T14:44:23.830 回答
0

看起来您只需要挂钩文本框的 on text changed 事件,然后将您的逻辑放入代码 benind.Something 像这样

标记

<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自动完成

于 2013-01-25T14:32:57.787 回答