Twitter Typeahead.js - 根據選擇刪除數據

Question

我使用typeahead.js 0.9.3，它的工作方式很流行。我的問題是，是否可以在「typeahead：selected」事件（或任何事件）上從數據集中刪除數據。

我在使用Typeahead的prefetch選項在頁面加載中提取數據集中的數據。我知道我可以撥打電子郵件$('selector').typeahead('destroy')並重新初始化打字頭，並在prefetch對象中使用filter，但重新調用數據似乎相當重量級（我們沒有在本地存儲中緩存數據）。

我想我正在尋找類似於filter函數的東西來遍歷基準數組並刪除先前選擇的（或所有選定的）數據。它看起來並不像公共職能那樣做，但也許我錯過了它。

我已經通過typeahead的文檔閱讀並在這裏搜索，但還沒有找到答案。

編輯：我從prefetch切換到local和使用AJAX post調用來獲取數據解決眼前的問題，將其設置爲一個全局變量，然後將它傳遞給typeahead，在那裏我可以添加/刪除從項目全球性的數據陣列，然後根據需要銷燬/重新整合預先輸入的數據。遠非理想，但它有效。

Answer 1

正如你所指出的那樣，如果不是現行版本的大規模黑客攻擊，如果不是不可能的話，這是非常棘手的。 有你需要三樣東西：

1. 遠程作爲一個功能選項（如果你實現自己的getter函數訪問您的數據，篩選查詢，並刪除您已經選擇的項目
2. 。高速緩存控制：能夠拒絕鍵入控制使用高速緩存來執行上次執行的建議搜索
3. 按需建議搜索，僅在需要時才刷新建議結果（當您進入輸入框並開始typin g你的查詢）。

下一個typeahead版本（0.10當前正在開發中）可能支持所需的功能。
但是......碰巧我的（Svakinn）typeheadhead支持你需要的所有三種條件。 您的配置應該提供getter函數，您可以從init數據中選擇數據，並通過查詢字符串和已經選擇的選項進行過濾。

remote: yourGetterFunction 

然後，你需要禁用建議緩存：

skipCache: true 

如果你不想等待下一次預輸入版本，我建議你嘗試一下：
https://github.com/Svakinn/typeahead.js/tree/typeaheadSimple 也有現場直播JQuery和Knockout示例可用：
https://github.com/Svakinn/typeahead.js/blob/typeaheadSimple/Examples.md

Answer 2

試試這個，這對我很有用。

$('#selector').typeahead('setQuery', ""); 

Answer 3

您可以在任何Bloodhound數據集的Typeahead 0.10中實現此功能，無論是遠程，預取還是本地。

只需跟蹤哪些數據已經獨立於Bloodhound數據集而選擇，並且不要使用Bloodhound#ttAdapater()作爲您的打印源。 ttAdapter方法僅僅是Bloodhound#get(query, cb)的一個包裝 - 所以不是直接調用get(query, cb)，而是使用自定義回調來檢查每個建議與當前選擇。

這裏有一個的jsfiddle - http://jsfiddle.net/likeuntomurphy/tvp9Q/

var selected = []; 

var select = function(e, datum, dataset) { 
    selected.push(datum.val); 
    $("#selected").text(JSON.stringify(selected)); 
    $("input.typeahead").typeahead("val", ""); 
} 

var filter = function(suggestions) { 
    return $.grep(suggestions, function(suggestion) { 
     return $.inArray(suggestion.val, selected) === -1; 
    }); 
} 

var data = new Bloodhound({ 
    name: 'animals', 
    local: [{ val: 'dog' }, { val: 'pig' }, { val: 'moose' }], 
    datumTokenizer: function(d) { 
     return Bloodhound.tokenizers.whitespace(d.val); 
    }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 

    // custom suggestion filter is applied after Bloodhound 
    // limits the set of possible suggestions 
    // see comment by Basti below 
    limit: Infinity 
}); 

data.initialize(); 

$('input.typeahead').typeahead(null, 
    { 
     name: 'animals', 
     displayKey: 'val', 
    /* don't use 
     source: data.ttAdapter(), */ 
     source: function(query, cb) { 
      data.get(query, function(suggestions) { 
       cb(filter(suggestions)); 
      }); 
     }, 
     templates: { 
      empty: '<div class="empty-message">No matches.</div>' 
     } 
    } 
).bind('typeahead:selected', select);