jQuery UI自动完成 - 输入与结果集不匹配时未显示结果-Java 学习之路

问题的简短版本

当输入字符串与结果字符串匹配时，自动完成功能正常，但不是 . 数据已成功从JSON中检索出来 .

更长的版本

我想用JSON数据动态编辑自动完成的源内容 .

当搜索字符串与first_name和last_name字段匹配时，以下方法有效 .

但是JSON url返回的更多，例如搜索用户名时，它仍会返回正确的数据 . 但这并没有在自动完成中显示，我的理论是自动完成UI强制'input value'与'result value'相同 .

JSON数据返回：

[
        {"pk": 1012912, "fields": {"first_name": "Barack", "last_name": "Obama"}}, 
        {"pk": 1017519, "fields": {"first_name": "George", "last_name": "Bush"}}
]

自动填充代码

如您所见，结果集由搜索功能设置 .

$('#search').autocomplete({
    source: [],
    search: function(event, ui){
        results = [];
        var json = jQuery.getJSON('http://jsondata.com?query='+event.target.value, function(data){
            for (var i=0; i<data.length; i++){
                results.push(data[i].fields.first_name + ' ' +data[i].fields.last_name); 
            };
        }).success(function(){
            $('#search').autocomplete('option', 'source', results);
            //The following debug proves that the 'results' are correct, even on search for usernames
            console.log(results);
        });
    },
});

如果我在#search领域搜索'Barack Obama'，我会得到我的结果，没问题 . 但是，如果说Barack Obama有用户名“baracko”并且我搜索他的用户名，那么我从JSON和结果数组中得到正确的结果（我用console.log检查了这一点），但结果没有显示 .

任何人都知道为什么？

针对未来googlers或那些感兴趣的解决方案

感谢ek_ny提供的一些提示，这是我的新JSON：

[{ 'value' : 'Barack Obama'}, { 'value' : 'George Bush'}]

以下是代码：

$('#search').autocomplete({
    source: function(req, res){
        jQuery.getJSON('http://jsondata.com/?query='+req.term, req, function(data){  
            var results = [];
            $.each(data, function(i, val){
                results.push(val.value)
            });
            //Add results to callback       
            res(results);
        });           
    },
});

2 回答

0
我不知道这是否有帮助，但我设置的自动填充程序有点不同 . 我使用source属性，它允许我控制回调到jQuery . 我的ajax调用以[{“id”：1，“label”：“Annie Hall”，.....]的形式返回项目 . 您可以根据需要修改Ajax调用的结果，具体取决于数据从服务器返回的方式 . 这是我用来调用它的代码 .
```
$("#movieSearch").autocomplete({
            source: function(req, res){
                $.getJSON(
                    "search.aspx",
                    {term : req.term},
                    function(data){
                        res(data);//you can also modify your results before you call res()
                    }
                );
            }
);
```
在你的例子中，困扰我的一件事是变量结果，在我看来它是一个全局变量 . 我们都知道（用Douglas Crockford的话说）全局变量是邪恶的 .
回复于 2024-05-07T09:00:50+08:00

这是您在没有结果时检测到的方式

source: function( request, response ) {
    $.getJSON( url, {
        term: extractLast( request.term )
    }, response )
    .error(function() {
        console.log("no results");
    });
},

回复于 2024-05-07T09:00:50+08:00

jQuery UI自动完成 - 输入与结果集不匹配时未显示结果