自动完成类别和自定义显示

时间:2013-05-02 11:42:34

标签: javascript jquery jquery-ui

我正在使用jQuery ui autocomplete 1.10.2问题是我无法让类别功能和自定义项目显示一起工作。

这是我的代码但不起作用

$.widget("custom.catautocomplete",$.ui.autocomplete,{
                                      _renderMenu: function( ul, items ) {
                                          var that = this,
                                            currentCategory = "";
                                          $.each( items, function( index, item ) {
                                            if ( item.category != currentCategory ) {
                                              ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
                                              currentCategory = item.category;
                                            }
                                            that._renderItem( ul, item );
                                          });
                                      }
                                    });
                            $("#search-input").autocomplete({
                                source:'${pageContext. request. contextPath}/autoComplete.htm',
                                select: function(event,ui){
                                     var item = ui.item;
                                     $("#url-container").html("");
                                     $("#url-container").append( "<a target='_blank' href='"+item.url+"' url='"+item.url+"' class='chosen'>"+
                                  "<strong style='color:#1f497d' >" + item.instrument
                                  +" </strong><strong style='color: red'> " + item.func + "</strong></a><br/>" )
                                 }
                                }).data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                              return $( "<li>" )
                                .append( "<a href='#' url='"+item.url+"' class='chosen'>"+
                                      "<strong style='color:#1f497d' >" + item.highlightedIns
                                      +" </strong><strong style='color: red'> " + item.func + "</strong></a>" )
                                .appendTo( ul );
                            };

问题是它只是显示类别而不是项目,项目就像一个空链接,我检查发现它与.data函数有关,我的代码在我制作之前工作得很好包含类别的小部件。

我该如何解决这个问题?

0 个答案:

没有答案