Question

我正在使用带有类别的JQuery UI远程自动完成功能。

$.widget( "custom.catcomplete", $.ui.autocomplete, {
    _renderMenu: function( ul, items ) {
        var self = this,
            currentCategory = "";
        $.each( items, function( index, item ) {
            if ( item.category != currentCategory ) {
                ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
                currentCategory = item.category;
            }
            cat = currentCategory;
            self._renderItem( ul, item );
        });
    }
});

$(function() {
        $( "#birds" ).catcomplete({
            delay:0,
            source: "/search.html?term="+ $("#birds").val(),
            minLength: 2,
            select: function( event, ui ){
            alert(ui.item.value);
            }
        });     
});

以下是我从来源获得的结果：

[{“value”：“只是一个产品”，“id”：“1”，“类别”：“类别名称”}]

问题是我无法使用警报（ui.item.value）来显示所选项目。

请帮忙吗？

感谢。

Answer 1

这不是你如何处理来源。看到这个.. http://api.jqueryui.com/autocomplete/#option-source 你可以用

阵列
字符串
回调功能

如果你想以json格式从页面接收数据，请使用jquery的$ .ajax（）看到这个for ajax http://api.jquery.com/jQuery.ajax/

你可以做点什么

$.ajax({url: 'search.php?term='+$("#birds").val(),
dataType: 'json',
beforeSend: function(xhrObj){
xhrObj.setRequestHeader("Accept","application/json");
},
async: false,
success: function(data){
bArray=new Array;
bJson=data;
bArray.push(bJson[0].value);
bArray.push(bJson[0].id);
bArray.push(bJson[0].category);// for multiple records put these 3 lines in loop and replace 0 with a counter
}
});

$( "#birds" ).autocomplete({
source: bArray,
select:function(event,ui)
{alert(ui.item.value);}     
});

别忘了申报bArray，bJson

但我仍然会说你做错了。您可以使用其中只有一个作为自动完成，而不是使用value，id，category。你能说出你在自动完成中的确切表现吗

JQuery UI catcomplete没有返回选定的结果

1 个答案: