当输入字符串与结果字符串匹配时,自动完成功能正常,但不是。数据已成功从JSON中检索出来。
我想用JSON数据动态编辑自动完成的源内容。
当搜索字符串与first_name和last_name字段匹配时,以下方法有效。
但是JSON网址会返回更多,例如搜索用户名时,它仍会返回正确的数据。但这并没有在自动完成中显示,我的理论是自动完成UI强制“输入值”与“结果值”相同。
[
{"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检查了这一点),但结果没有显示。
任何人都知道为什么?
感谢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);
});
},
});
答案 0 :(得分:4)
我不知道这是否有帮助,但我设置的自动填充功能有点不同。我使用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的话说)全局变量是邪恶的。
答案 1 :(得分:0)
这是您在没有结果时检测的方式
source: function( request, response ) {
$.getJSON( url, {
term: extractLast( request.term )
}, response )
.error(function() {
console.log("no results");
});
},