jQuery 自动完成呈现 SQL 数组/不是文本框选择答案

【问题标题】：jQuery autocomplete renders SQL Array / not textbox selectionsjQuery 自动完成呈现 SQL 数组/不是文本框选择
【发布时间】：2017-10-03 18:23:30
【问题描述】：

试图让基本的 jQuery 自动完成功能正常工作。在 VS 2017 中通过 WCF 服务使用 SQL Server。一切看起来都很好...... .aspx 呈现 OK，在文本框中输入 1 个字符，调试 .svc 正在触发，调试 SQL 函数并查看良好的数据抓取，调试 jQuery 并通过控制台日志查看返回该数组，通过控制台查看该数组随着在文本框中输入的每个额外字符而减少......但是在允许项目选择的页面上从未生成任何列表。奇怪的。甚至使用硬编码的国家/地区列表成功运行它，并且运行良好。包括 jQuery 和 HTML，不包括 .svc，因为它已确认返回准确的值。

    <script>
$(document).ready(function () {
    BindControls();
});

function BindControls() {
   $("#txtMembers1").autocomplete({
        source: function (request, response) {

            var val = request.term;
            console.log(val);
            $.ajax({
                url: "searchMembers1.svc/getMembers",
                data: JSON.stringify({ sLookUP: val }),
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                dataFilter: function (data) { return data; },
                success: function (data) {
                    response($.map(data, function (item) {
                        return {
                            value: item }
                    }))
                    console.log(data)
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
        },
        minLength: 2    // MINIMUM 1 CHARACTER TO START WITH.
    }); 

   /* var Countries = ["ARGENTINA", "AUSTRALIA", "BRAZIL", "BELARUS", "BHUTAN", "CHILE"];

    // BIND ARRAY OF STRINGS WITH AUTOCOMPLETE FUNCTION.
    $("#txtMembers").autocomplete({ source: Countries }); */


}

HTML --------

<head runat="server">
    <title></title>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>

  <style type="text/css" >
    .ui-autocomplete { max-height: 150px; overflow-y: auto; overflow-x: hidden; font-size: 9pt; }
    * html .ui-autocomplete { height: 100px; }
</style>

</head>
<body>

<form name="frmSearch" runat="server">
    <div style="font:15px Arial;" >
    <b>Members</b>:  <input id="txtMembers1" type="text" runat="server" />
   <%--<b>Members</b>:  <asp:TextBox ID="txtMembers" runat="server" ></asp:TextBox>--%>
</div>

【问题讨论】：

您还可以粘贴服务的输出吗？假设来自服务的响应是一个字符串数组，您可以尝试修改成功函数以返回响应（数据）；
da search1 (55,17) dar search1 (55,17) [object Object] search1 (68,25) { [functions]: , proto: { }, d: [ ] } [object Object] search1 (68,25) { [functions]: , proto: { }, d: [ ] } ly search1 (55,17) [object Object] search1 (68,25) { [functions]: , proto: { }, d: [ 0: "Lyles", 1: "Lyles", 2: "Lyles", 长度: 3 ] }
所以，具有数组的属性是 d。您不应该使用 data.d 访问它然后映射它吗？喜欢 - response($.map(data.d, function (item) { return { value: item } }))
我们赢了！！！非常感谢...现在正在工作。
太棒了！我会将其发布为答案，请将我的帖子标记为答案并关闭问题。

标签： jquery vb.net wcf autocomplete

【解决方案1】：

由于它使用的是硬编码数组，因此我怀疑您的 Web 服务的响应格式。正如我从 cmets 中了解到的，您的响应中的属性“d”包含数据数组，因此您应该映射 data.d 而不是响应中的数据。

response($.map(data.d, function (item) { return { value: item } }))

【讨论】：