typeahead不处理所有的猎犬结果

时间:2015-05-08 12:40:44

标签: javascript jquery typeahead.js

所以我在输入时使用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个结果。希望有人知道它有什么问题。

1 个答案:

答案 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: {