Jquery ui 自动完成响应

我试图使用bootstrap的popover组件在文本框下“弹出”jquery自动完成结果

我在一个隐藏的div（#包装器）中呈现自动完成查询的结果，我希望在呈现完成时设置我的popover的内容并显示它

为此，我重载了

\u renderItem

函数，该函数将结果的div附加到隐藏容器（#包装器）中

我以为

response

函数在renderItem调用完成时被调用，但我遗漏了一些东西，因为从来没有调用过response函数

有解决办法吗

谢谢

$("#bookSearch")
             .autocomplete({
                 minLength: 0,
                 source: '/Autocomplete/Books',
                 focus: function (event, ui) {
                     $("#bookSearch").val(ui.item.label);
                     return false;
                 },
                 search: function(event, ui) {
                     $('#wrapper').empty();
                 },
                 response: function (event, ui) {
                    $('#bookSearch').popover('destroy');
                    $('#bookSearch').popover({
                            html: true,
                            placement: 'bottom',
                            content: $('#wrapper').html()
                    });
                    $('#bookSearch').popover('show');
                 }

             })
             .data("autocomplete")._renderItem = function (ul, item) {
                 $('<div class="media"></div>')                             
                                    .data("item.autocomplete", item)
                                    .append("<a class=\"pull-left\" href=\"#\"><img class=\"media-object\" src=\""
                                    + item.ImgUrl
                                    + "\"></a><div class=\"media-body\"><h6 class=\"media-heading\">"
                                    + item.Name
                                    + "</h6>"
                                    + item.Author + "</div>").appendTo('#wrapper');


             };

$（“#图书搜索”）
.自动完成({
最小长度：0，
来源：“/Autocomplete/Books”，
焦点：功能（事件、用户界面）{
$（“#bookSearch”）.val（ui.item.label）；
返回false；
},
搜索：功能（事件、用户界面）{
$（“#包装器”）.empty（）；
},
响应：功能（事件、用户界面）{
$（'bookSearch'）.popover（'destroy'）；
$（#bookSearch'）.popover({
是的，
位置：'底部'，
内容：$（“#包装器”）.html（）
});
$（'bookSearch'）.popover（'show'）；
}
})
.数据（“自动完成”）。\u renderItem=功能（ul，项目）{
$('')                             
.data（“item.autocomplete”，item）
.append（“）
+项目名称
+ ""
+item.Author+”）.appendTo（“#包装器”）；
};

我通过在css文件中添加用于自动完成的z索引样式，解决了这个问题

.ui-autocomplete {
  z-index: 10000;
}

如有必要，请记住为z索引设置更高的值。作为记录，我在HTML文件中有类似的内容

<div class="ui-widget">
   <label for="employee">Employee:</label>
   <input id="employee" type="text" name="employee" />
</div>

雇员：

当引导程序有自己的.typeahead时，使用jquery UI的.autocomplete有什么好的理由吗<代码>响应添加到1.9中。你用的是1.9吗？此外，response主要用于在建议之前操作数据（如果我没有弄错的话，就在renderItem之前）。好的，首先我使用的是jquery ui 1.8.20，我想正如Juda所说的，我可以自定义引导打印头来做我想做的事情。