无法在HTML输入字段中填充自动完成结果

时间:2018-02-27 13:34:27

标签: jquery ajax

您好我正在尝试执行自动完成回调函数,我能够从数据库中检索数据但无法将列表填充到输入框。我正在使用servlet。

HTML:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
        <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
        <script src="js/app-ajax.js" type="text/javascript"></script>
        <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    </head>
<body>
    <div class="ui-widget">
        <label for="userId">Enter Your Name:</label>
        <input id="userId">
    </div>
    <strong id="selected"></strong>
    <strong>Ajax Response</strong>:
    <div i="ajaxGetUserServletResponse" style="margin-top:2em; font-family:Arial">
</body>
</html> 

脚本:

$(document).ready(function () {
    $("#userId").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "GetAutoCompResp",
                dataType: "json",
                method: "post",
                data: {
                    userId: request.term
                },
                success: function (data) {
                    alert(data);
                    response(data);
                }
            });
        },
        minLength: 3,
        select: function (event, ui) {
            var value = ui.item.label;
            $("#ajaxGetUserServletResponse").text(value);
            return false;
        }
    });
});

Please see the output here

0 个答案:

没有答案