Текстовое поле автозаполнения jquery не работает с основными страницами и страницами содержимого в ASP.NET - PullRequest
0 голосов
/ 22 марта 2012

У меня есть главная страница, на которой у меня есть следующий код.

<head runat="server">
    <link href="StyleSheet.css" rel="stylesheet" runat="server" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
    <asp:contentplaceholder id="LocalScripts" runat="server"></asp:contentplaceholder>
</head>

<body id="body" runat="server">
    <form id="form1" runat="server" defaultbutton="SignOutLB">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </form>
</body>

Моя страница контента имеет следующий код.

<asp:Content ID="ScriptContent" ContentPlaceHolderID="localScripts" runat="server">
<script type="text/javascript">
    function suggest(inputString)
    {
        if(inputString.length == 0) 
        {
            $('#suggestions').fadeOut();
        } 
        else 
        {
            $('#AAATB').addClass('load');
            $.post("AutoSuggest.aspx?ST=" + inputString, function(data){
                if(data.length >0) 
                {
                    $('#suggestions').fadeIn();
                    $('#suggestionsList').html(data);
                    $('#AAATB').removeClass('load');
                }
            });
        }
    }

    function fill(thisValue) 
    {
        $('#AAATB').val(thisValue);
        setTimeout("$('#suggestions').fadeOut();", 600);
    }
</script>
</asp:Content>

А код ASP.NET выглядит следующим образом.

<asp:TextBox ID="AAATB" runat="server" Width="90px" MaxLength="6" onkeypress="return IsNumberKey(event)" CssClass="textboxStyle" ValidationGroup="projNoValGp" onkeyup="suggest(this.value);" onblur="fill();" />
<div class="suggestionsBox" id="suggestions" style="display: none;"> 
    <img src="Images/arrow.png" style="position: relative; top: -2px; left: 50px;" alt="" />
    <div class="suggestionList" id="suggestionsList"> &nbsp; </div>
</div>

Мой AutoSuggest.aspx содержит следующий фрагмент кода (я сделал это для тестирования. Когда функциональность сработает, я изменю это для получения данных из базы данных.)

protected void Page_Load(object sender, EventArgs e)
{
    string[] arr = new string[] {
                        "1234",
                        "1111",
                        "1333",
    };
    for (int i = 0; i < 3; i++)
    {
        Response.Write("<li onClick=\"fill(\'" + arr[i] + "\');\">" + arr[i] + "</li>");
    }
}

Это работает до такой степени, что отображаются значения «1234», «1111», «1333». Но когда я выбираю одно из этих значений, оно не отражается в текстовом поле «AAATB».

Буду признателен за помощь в решении этой проблемы.

Спасибо, Каролина

1 Ответ

0 голосов
/ 26 марта 2012

Я думаю, что знаю. Вы используете «#AATB» в качестве селектора для текстового поля. Однако это идентификатор сервера и будет отображаться на клиенте по-другому. Попробуйте использовать это в качестве кода заполнения:

function fill(thisValue)
{
    $('.textboxStyle').val(thisValue);           
    setTimeout("$('#suggestions').fadeOut();", 600);
}  

Идея состоит в том, чтобы использовать css-класс в качестве селектора для текстового поля, поскольку он не изменен.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...