javascript - 自动完成标签不显示数据

标签 javascript php jquery autocomplete

我正在尝试使用下面给定的脚本自动完成 MySQL 数据库中的数据。它在开发人员工具网络中给出正确响应时不显示标签。

JS

$('#search').autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: 'search.php',
                    dataType: "json",
                    method: 'post',
                    data: {
                        name_startsWith: request.term,
                        type: 'type'
                    },
                    success: function( data ) {
                        response( $.map( data, function( item ) {
                                return {
                                    label: code['id'],
                                    value: code['id'],
                                    data : item
                                }
                            }));
                        }
                    });
            },
            autoFocus: true,            
            minLength: 1,
            select: function( event, ui ) {
                $('#player').val(ui.item.data.player);
                $('#marks').val(ui.item.data.marks);
            }               
        });  

search.php

$type = $_POST['type'];
$id = $_POST['name_startsWith'];
$query = $db->prepare("SELECT id, player, marks, note FROM players where ( id LIKE '".$id."%') ");
$query->execute();
$data = array();

$i = 0;
while ($row = $query->fetch(PDO:: FETCH_ASSOC)) {

    $data[$i]['id'] = $row['id'];
    $data[$i]['player'] = $row['player'];
    $data[$i]['marks'] = $row['marks'];
++$i;
}  
echo json_encode($data);

网络响应

[{"id":"4133","player":"Sam","marks":"65"},{"id":"4955","player":"valiu","marks":"34"}]

最佳答案

替换这个:

 return {
     label: code['id'],
      value: code['id'],
      data : item
 }

与:

return {
     label: item['id'],
      value: item['id'],
      data : item
 }

你传递了错误的参数。

同样来自fiddle,更新这些然后测试

将 url 更改为 url: 'https://jqueryui.com/resources/demos/autocomplete/search.php?term=ro' 并将数据类型更改为 dataType: "jsonp"

然后测试

关于javascript - 自动完成标签不显示数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53059550/

相关文章:

javascript - 如何在 Angular 中制作动态区域 echarts

javascript - Bootstrap 可折叠面板 - 从打开的部分开始

php - 将 8 位整数转换为 dd/mm/yyyy

jquery - masonry 在移动 View 中弄乱了 Bootstrap 导航栏

javascript - nginx 1.14.0 Ubuntu 上的 400 错误请求

javascript - Laravel 5.6,如何从一个函数返回两个 View

php - ACF Repeater 字段不输出图像

php - 用于列出附加驱动器、已用空间和可用空间的 HTML/PHP

jquery - 在随机列表项上添加类

jquery - 在 Ace Editor 中键入空格会产生特殊字符