0

我正在使用 .NET 4.0、AJAX 4.1.7.1005 和 VS2010 C#。

我已经多次使用 ajax 自动完成编写代码,没有任何问题。我现在需要将一个自动完成文本框放在一个表单视图中,该表单视图从一个从数据库中选择记录的网格视图打开,我可以让自动完成的初始部分工作 - 它从数据库中获取数据并将其显示在选择列表。我遇到的问题是对我的 javascript 的 OnClientPopulated 和 OnClientItemSelected 调用。我尝试将 js 作为 scriptmanager.registerclientscriptblock 放在页面、formview 和代码隐藏中...但是,无论我将 js 代码放在哪里,它都会引发此错误:

JavaScript 运行时错误:属性“OnSelectedItem”的值为 null 或未定义,不是 Function 对象

如果我删除 OnClientxxx 调用,则自动完成适用于文本框,但我需要获取其他详细信息以填充一些隐藏字段(当前未隐藏以进行测试)。我在文本框上调用 OnTextChanged 事件来尝试设置其他文本框的值。

我知道它与它的呈现方式以及它如何调用脚本有关,但我仍在学习,并且在搜索 google/bing 或在 SO 上还没有找到一个好的答案。

也许我会朝着错误的方向前进,但非常感谢任何帮助。

我的代码:


页面

<asp:TextBox ID="txt_approver1name" runat="server" Width="225px" Text='<%#Bind("APPROVER1_NAME")%>' AutoPostBack="true" OnTextChanged="txt_approver1name_TextChanged" />

<ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx1" ID="autoComplete1" TargetControlID="txt_approver1name"
ServicePath="~/webservices/autocomplete.asmx" ServiceMethod="GetCompletionList" MinimumPrefixLength="3"
CompletionInterval="200" EnableCaching="false" CompletionSetCount="5" CompletionListCssClass="autocomplete_completionListElement"
CompletionListItemCssClass="autocomplete_listItem" CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem"
ShowOnlyCurrentWordInCompletionListItem="true">

<Animations>
    <OnShow>
        <Sequence>
            <%-- Make the completion list transparent and then show it --%>
            <OpacityAction Opacity="0" />
            <HideAction Visible="true" />

            <%--Cache the original size of the completion list the first time
                the animation is played and then set it to zero --%>
            <ScriptAction Script="
                // Cache the size and setup the initial size
                var behavior = $find('AutoCompleteEx1');
                if (!behavior._height) {
                    var target = behavior.get_completionList();
                    behavior._height = target.offsetHeight - 2;
                    target.style.height = '0px';
                }"
            />

            <%-- Expand from 0px to the appropriate size while fading in --%>
            <Parallel Duration=".1">
                <FadeIn />
                <Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx1')._height" />
            </Parallel>
        </Sequence>
    </OnShow>
    <OnHide>
        <%-- Collapse down to 0px and fade out --%>
        <Parallel Duration=".1">
            <FadeOut />
            <Length PropertyKey="height" StartValueScript="$find('AutoCompleteEx1')._height" EndValue="0" />
        </Parallel>
    </OnHide>
</Animations>
</ajaxToolkit:AutoCompleteExtender>

<asp:TextBox ID="hdn_txt_approver1username" runat="server" Text='<%#Bind("APPROVER1_USERNAME")%>' />
<asp:TextBox ID="hdn_txt_approver1email" runat="server" Text='<%#Bind("APPROVER1_EMAIL")%>' />
<asp:TextBox ID="hdn_txt_approver1emplid" runat="server" Text='<%#Bind("APPROVER1_EMPLID")%>' />

cs页面

    protected void txt_approver1name_TextChanged(object sender, EventArgs e)
{
    TextBox txt_approver1name = (TextBox)FormView_UpdateMode.FindControl("txt_approver1name");
    string cleanname = txt_approver1name.Text.ToString();
    string[] split = cleanname.Split(new Char[] { '|' });
    txt_approver1name.Text = split[0].Trim();

    string onListPopulated = "<script type='text/javascript'>" +
                    "function onListPopulated {" +
                    "var completionlist = $find('AutoCompleteEx1').get_completionList();" +
                    "completionlist.style.width = 'auto';}</script>";

    string OnSelectedItem = "<script type='text/javascript'>" +
                    "function OnSelectedItem(source, eventArgs) {" +
                    "var empdetails = eventArgs.get_value();" +
                    "empdetails = empdetails.split('|');" +
                    "var edTitle = empdetails[0];" +
                    "var edEmpID = empdetails[1];" +
                    "var edEmail = empdetails[2];" +
                    "var edUsername = empdetails[3];" +
                    "var approver1email = document.getElementById('<%=(TextBox)FormView_UpdateMode.FindControl('hdn_txt_approver1email').ClientID %>');" +
                    "var approver1emplid = document.getElementById('<%=(TextBox)FormView_UpdateMode.FindControl('hdn_txt_approver1emplid').ClientID %>');" +
                    "var approver1username = document.getElementById('<%=(TextBox)FormView_UpdateMode.FindControl('hdn_txt_approver1username').ClientID %>');" +
                    "approver1email.value = edEmail;"+
                    "approver1emplid.value = edEmpID;"+
                    "approver1username.value = edUsername;" +
                    "</script>";


    ScriptManager.RegisterClientScriptBlock(this.FormView_UpdateMode, this.GetType(), "onListPopulated", onListPopulated, true);
    ScriptManager.RegisterClientScriptBlock(this.FormView_UpdateMode, this.GetType(), "OnSelectedItem", OnSelectedItem, true);

    var acx = (AjaxControlToolkit.AutoCompleteExtender)FormView_UpdateMode.FindControl("autoComplete1");
    acx.OnClientItemSelected = "OnSelectedItem";
    acx.OnClientPopulated = "onListPopulated";
}

如果您需要任何其他详细信息,我可以提供。先感谢您!

此外,我需要在这个表单视图中有两个自动完成字段,所以如果我可以让一个工作,那么我可以解决另一个。

4

1 回答 1

0

我自己解决了这个问题,只需将隐藏字段放在表单视图之外,然后添加一个更改事件以使用隐藏字段的值填充表单视图中的可见字段。是的,一些额外的步骤来获得我的结果,但它的工作原理永远不会少。

于 2013-11-12T14:18:58.400 回答