Devbridge JQuery 自动完成功能不适用于 serviceUrl答案

【问题标题】：Devbridge JQuery Autocomplete not working with serviceUrlDevbridge JQuery 自动完成功能不适用于 serviceUrl
【发布时间】：2016-04-19 17:58:26
【问题描述】：

我正在尝试实现 devBridge 自动完成功能，但它不适用于 ajax。当我使用没有 php 的手动 json 对象但我需要从数据库中获取数据时，它可以工作。 PHP代码：

 <?php
require_once "medoo.php";
$database = new medoo([
    'database_type' => 'mysql',
    'database_name' => 'elektriksikayet',
    'server' => 'localhost',
    'username' => 'root',
    'password' => '',
    'charset' => 'utf8',
    'port' => '3307'
]);
$return_arr = [];
$keyword =  $_POST['keyword'];
$companies = $database->select('companies','company_name');
foreach ($companies as $comp){
    $row_array['label'] = $comp;
    array_push($return_arr, $row_array);
}
echo json_encode($return_arr);
?>

HTML 代码：

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery.js"></script>
    <script src="js/jquery-autocomplete.js"></script>
    <script src="js/companyAutoComplete.js"></script>
</head>
<body>
<input type="text" id="autocomplete"/>
</body>
</html>

JS 代码

$(document).ready(function () {
    $("#autocomplete").autocomplete({
        serviceUrl:'AutoComplete.php', //tell the script where to send requests
        //callback just to show it's working
        onSelect: function(value){ alert('You selected: ' + value); }
    });
});

【问题讨论】：

标签： javascript php jquery jquery-autocomplete

【解决方案1】：

您的回复应该是有效的 JSON 格式和以下格式：

   {
        suggestions: [
            { "value": "United Arab Emirates", "data": "AE" },
            { "value": "United Kingdom",       "data": "UK" },
            { "value": "United States",        "data": "US" }
        ]
    }

您返回的内容似乎没有这种结构。

【讨论】：

【解决方案2】：

对于其他有同样问题的人：您应该这样管理响应：

$("#autocomplete").autocomplete({
        serviceUrl:'AutoComplete.php'
        transformResult: function (response) {
                return {
                    suggestions: $.map(response, function(dataItem) {
                        return { value: dataItem.name, data: dataItem };
                    })
                };
            },
        });

【讨论】：