使用PHP和Json将数据检索到自动完成中。jQueryUI1.8.2+；_Php_Jquery_Jquery Ui_Autocomplete_Jquery Ui Autocomplete

使用PHP和Json将数据检索到自动完成中。jQueryUI1.8.2+；

php jquery jquery-ui autocomplete

使用PHP和Json将数据检索到自动完成中。jQueryUI1.8.2+；,php,jquery,jquery-ui,autocomplete,jquery-ui-autocomplete,Php,Jquery,Jquery Ui,Autocomplete,Jquery Ui Autocomplete,我制作了一个电影自动完成，你可以在其中键入一封信，它会给你一个电影的建议列表。在每部电影旁边，我还添加了电影发行的日期以下是我在PHP中解析它的方式： $tmdb = new TMDb($api_key); $json = json_decode($tmdb->searchMovie($_GET['term'])); $response = array(); $i=0; foreach($json as $movie){ if($i >= 6) break; $re

我制作了一个电影自动完成，你可以在其中键入一封信，它会给你一个电影的建议列表。在每部电影旁边，我还添加了电影发行的日期

以下是我在PHP中解析它的方式：

$tmdb = new TMDb($api_key);
$json = json_decode($tmdb->searchMovie($_GET['term']));
$response = array();
$i=0;
foreach($json as $movie){
    if($i >= 6) break;
    $response[$i]['value'] = $movie->name;
    $response[$i]['label'] = $movie->name . ' <span class="m_rel">(' . date('Y',strtotime($movie->released)).')</span>';

    $i++;
}
echo json_encode($response);

$tmdb=新的tmdb（$api_键）；
$json=json_decode（$tmdb->searchMovie（$_GET['term']）；
$response=array（）；
$i=0；
foreach（$json作为$movie）{
如果（$i>=6）中断；
$response[$i]['value']=$movie->name；
$response[$i]['label']=$movie->name.'（'.date（'Y'，strottime（$movie->released）））；
$i++；
}
echo json_编码（$response）；

现在，如果我使用jQuery1.8.2，一切都会很好地工作

我得到这个结果：

如果我使用更高版本的jQuery UI，我会得到以下结果：

html很简单，它只是一个表单，而自动完成则是来自jQuery的表单，所以没有什么特别之处。一旦我更改了UI的版本，问题就发生了

有人能帮我解决这个问题吗？我不能使用jQuery1.8.2，因为我在draggable和IE（所有版本）上遇到了其他问题，这些问题无法解决，因为这是一个已知的bug

安德鲁·惠特克回答后的我的JS：

var movieName = $('#movieName');
movieName.autocomplete({
    source: 'movieInfo.php',
    select: function (event, ui) {
        $(this).val(ui.item.imdbid);
        $(".re5").submit()
    }
})._renderItem = function(ul, item) {
    return $("<li></li>")
        .data("item.autocomplete", item)
        .append("<a>" + item.label + "<span class='m_rel'>" + item.releasedate + "</span></a>")
        .appendTo(ul);
};

var movieName=$（'#movieName'）；
movieName.autocomplete({
来源：“movieInfo.php”，
选择：功能（事件、用户界面）{
$（this.val（ui.item.imdbid）；
$（“.re5”）.submit（）
}
})._renderItem=功能（ul，项目）{
返回$（“”）
.data（“item.autocomplete”，item）
.append（“+item.label+”+item.releasedate+”）
.附录（ul）；
};

“re5”是表单的类

多亏了很多

用autocomplete覆盖菜单项外观的首选方法是替换默认的

\u renderItem

方法，如下所示

所以我要做两件事：

修改PHP以不在结果中返回标记：

$tmdb = new TMDb($api_key);
$json = json_decode($tmdb->searchMovie($_GET['term']));
$response = array();
$i=0;
foreach($json as $movie){
    if($i >= 6) break;
    $response[$i]['value'] = $movie->name;
    $response[$i]['label'] = $movie->name;
    $response[$i]['releasedate'] = $movie->released;

    $i++;
}
echo json_encode($response);

覆盖

\u renderItem

方法以在

span

中显示发布日期：

$("#selector").autocomplete({ /* options */ })
    .data( "autocomplete" )._renderItem = function(ul, item) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append("<a>" + item.label + " <span class='m_rel'>(" + item.releasedate + ")</span></a>")
            .appendTo(ul);
    };

$（“#选择器”）.autocomplete（{/*选项*/}）
.数据（“自动完成”）。\u renderItem=功能（ul，项目）{
返回$（“”）
.data（“item.autocomplete”，item）
.append（“+item.label+”（“+item.releasedate+”）
.附录（ul）；
};

抱歉，如果PHP有点不正常；我不是这方面的专家。