所以我在输入时使用typeahead作为建议。除了一件事,一切都像魅力一样:它只显示结果。我正在使用远程搜索。当我直接进入页面时,它会显示10个预期的结果(查询设置为最多10个rsults)。如果我从bloodhound警告data.length它也会显示10个搜索结果。我已经通过提醒检查并在结束时发出警报,如果有什么问题,但所有警报都可以。
这是我的JQ:
var producten = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
limit: 100,
remote: {
'cache': false,
url: 'ajax/mysite.php?query=%QUERY',
wildcard: '%QUERY',
filter: function (data) {
//alert(data.length); when alert is active it shows that the length is 10
return data;
}
}
});
producten.initialize();
var i=0 //Have this for the loops to check if all the alerts where coming trough
$('.menuTypeahead').typeahead({
highlight: true
}, {
name: 'menuZoek',
source: producten.ttAdapter(),
displayKey: 'artikelNaam',
templates: {
suggestion: function (producten) {
i++;
alert(i+".1"); //begin alert
var resultaat=''
if(producten.artikelNaam=='geen suggestie'){
resultaat='<strong>' + producten.artikelNaam + '</strong>';
} else {
if(producten.foto==1){
imgLink='img/'+producten.barcode+'.jpg';
} else {
imgLink='css/pics/no_image.jpg';
}
if(producten.vers==1){
$vers='(vers)';
} else {
$vers='';
}
$("#menuSearchLink").val("artikel.php?barcode="+producten.barcode);
resultaat= '<div>'+
'<a href="artikel.php?barcode=' + producten.barcode + '&refer='+temp+'">'+
'<div class="search-image">'+
'<img src="'+imgLink+'" style="height:50px;width:auto">'+
'</div>'+
'<div style="min-height:50px;">'+
'<strong>' + producten.artikelNaam + ' '+$vers+'</strong>' +
'<br>' + producten.inhoud + ' ' + producten.type + ' - ' + producten.artikelMerk +
'</div>'+
'</a>'+
'</div>';
}
alert(i+".2"); //end alert
return resultaat;
}
}
});
我回来的JSON如下:
[{"ID":"266","barcode":"8711577077020","artikelNaam":"(combi)magnetronreiniger","artikelMerk":"HG","inhoud":"500","type":"ml","foto":"0","vers":"0","voorraadID":null},
{"ID":"329","barcode":"8710400307549","artikelNaam":"3 Laags Tissues","artikelMerk":"Albert Heijn","inhoud":"80","type":"stuks","foto":"0","vers":"0","voorraadID":"188"},
{"ID":"261","barcode":"5000204676150","artikelNaam":"5in1 Laminaatreiniger","artikelMerk":"Pledge","inhoud":"750","type":"ml","foto":"0","vers":"0","voorraadID":null},
{"ID":"14","barcode":"8718452111725","artikelNaam":"8 Goudeerlijk Witte Bollen","artikelMerk":"Jumbo","inhoud":"8","type":"stuks","foto":"0","vers":"0","voorraadID":null},
{"ID":"337","barcode":"8710400504498","artikelNaam":"Aardappelschijfjes Voorgekookt","artikelMerk":"Albert Heijn","inhoud":"450","type":"g","foto":"0","vers":"0","voorraadID":"195"},
{"ID":"72","barcode":"8718449034150","artikelNaam":"Acacia Honing","artikelMerk":"Jumbo","inhoud":"350","type":"g","foto":"0","vers":"0","voorraadID":null},
{"ID":"338","barcode":"5410036501726","artikelNaam":"Allesreiniger ","artikelMerk":"Dettol","inhoud":"1","type":"l","foto":"0","vers":"0","voorraadID":null},
{"ID":"283","barcode":"8710400771753","artikelNaam":"Appelsap uit Geconcentreerd Sap","artikelMerk":"Albert Heijn","inhoud":"1","type":"l","foto":"0","vers":"0","voorraadID":null},
{"ID":"315","barcode":"8718449066762","artikelNaam":"Augurken Fijn","artikelMerk":"Jumbo","inhoud":"340","type":"g","foto":"0","vers":"0","voorraadID":null},
{"ID":"40","barcode":"5410231103404","artikelNaam":"Backin Baking Powder","artikelMerk":"Dr. Oetker","inhoud":"5","type":"stuks","foto":"0","vers":"0","voorraadID":null}]
此外,当搜索其他查询时,它仅在下拉列表中返回5个结果。希望有人知道它有什么问题。
答案 0 :(得分:0)
在进一步搜索之后,我偶然发现了另一个stackoverflow帖子和Github上的一个问题。我提到的问题现在是Github的一个已知问题
Stackoverflow:Strange behaviour Typeahead with remote JSON
Github:https://github.com/twitter/typeahead.js/issues/1218
还了解到,今天类型已经限制了5个rsults。陈述这段代码:
$('.menuTypeahead').typeahead({
highlight: true
}, {
name: 'menuZoek',
source: producten.ttAdapter(),
displayKey: 'artikelNaam',
limit: 10, //new piece of code
templates: {