1

我正在使用带有类别的 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","category":"Category Name"}]

问题是我无法让警报（ui.item.value）工作并显示所选项目。

请问有什么帮助吗？

谢谢。

4

1 回答 1

0

这不是你处理源的方式。看到这个.. http://api.jqueryui.com/autocomplete/#option-source 你可以使用

  • 大批
  • 细绳
  • 回调函数

如果您想从 json 格式的页面接收数据，请使用 jquery 的 $.ajax() 查看 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 ，您只使用其中一个作为自动完成。你能说出你在自动完成中到底显示了什么吗

于 2012-10-25T09:52:08.150 回答