2017-03-31 23 views
1

我使用twitter typeahead提供從web服務返回的結果的下拉列表。我發現它只顯示這些結果的一個子集;顯然它壓制任何以相同的第一個詞開頭的詞。Twitter typeahead不顯示結果,他們以相同的單詞開頭

var $termInput = $("#someId"); 
    var lookup = new Bloodhound({ 
     datumTokenizer: Bloodhound.tokenizers.whitespace, 
     queryTokenizer: Bloodhound.tokenizers.whitespace, 
     remote: { 
       url:/search/ + "%QUERY", 
       wildcard: '%QUERY' 
     } 
    }); 

    lookup.initialize(); 

    $termInput.typeahead(
     { hint: true, highlight: true }, 
     { 
      source: lookup, 
      name: 'cases', 
      displayKey: 'id', 
      valueKey: 'id', 
      templates: { 
       empty: "<div class='omniboxresult nomatch'>No matching cases found</div>", 
       suggestion: function(data) { 
        console.log(data); 


        return "<div class='omniboxresult'><div class='caseName'>" + "hi " +data.text + "</div></div>"; 
       } 
      } 
     } 
    ); 

HTML是:

<input type=text" class="form-control" id="someId" value="" data-provider="typeahead" autocomplete="off"> 

使用網絡標籤我知道我的web服務將返回(當我進入 「歐」):

[{"id":"1991003933","level":0,"text":"EUROPEAN COMMUNITY"}, 
{"id":"1971004125","level":0,"text":"EUROPEAN ECONOMIC COMMUNITY"}, 
{"id":"2011007673","level":0,"text":"EUROPEAN UNION"}, 
{"id":"2011000582","level":0,"text":"EUROPEAN UNION"}] 

但我只得到以下在我的輸出中:

enter image description here

如果我輸入「e」,我會得到更多結果,例如「英語」,這不是壓制(但我仍然只得到一個結果,與開始的「歐洲」

爲什麼會出現這種情況,我怎麼能得到它,以顯示所有結果收到?

+0

這最終是一個鍵入錯誤。請注意,有兩個版本的typeahead。原來的和被遺棄的https://twitter.github.io/typeahead.js/和維護版的修復版https://typeahead.js.org/。第一個被遺棄的人有這個bug,可能會永遠 –

回答

1

我跑成。在我的項目類似的問題時,我想顯示的名稱自動完成建議,我想顯示的名字,然後姓和名自動完成建議我實現最終看起來是這樣的:

Sar = Sara, Sarah, Saralou, Sarchenko, Sargent

Sarah[space] = Sarah, Sarah Majercik, Sarah Maddux, Sarah Zarek, Sarah Anderson

並不完美,我寧願一次有人做Sarah不再顯示空間,但我還沒有想通了這一點呢。我的解決方案是將我的數據集按照字母順序加上所有唯一的名字和姓氏。我用的是prefetch但我認爲remote也有可用的filter方法:

var lookup = new Bloodhound({ 
    datumTokenizer: Bloodhound.tokenizers.whitespace, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
      url:/search/ + "%QUERY", 
      filter: function(list) { 
       var uniques = []; 
       // parse out unique names 

       // my list was literally a list of first and last names so I concat them, you'll likely need to do a bit more work here 
       return uniqes.concat(list); 
      }, 
      wildcard: '%QUERY' 
    } 
}); 

使用此您的結果將是這樣的:

EURO = EUROPEAN, EUROPEAN COMMUNITY, EUROPEAN ECONOMIC COMMUNITY, EUROPEAN UNION

希望這有助於。

相關問題