If you are using local data or prefetched data with typeahead.js and you want to refresh that data there is a three step process you need to adhere to;
- Do not pass a name into your typeahead, doing so will initiate LocalStorage and your changes will not be registered.
- When you want to refresh the data, you first need to destroy the current typeahead instance .typeahead('destroy') will accomplish this.
- Next we need to recall typeahead with the updated local values or prefetched value.
That first point is important and caused me a few headaches, hopefully upon reading this you will avoid those same headaches with typeahead.js
Here is a quick example;
var items = ['aaa', 'bbb', 'ccc'];
$('#item').typeahead({
local: items
});
$('#add_item').click(function() {
items.push('ddd');
$('#item').typeahead('destroy');
$('#item').typeahead({
local: items
});
});
Once #add_item
is clicked, 'ddd' will be searchable.
This is taken from the Instant Typeahead.js book I have written.