How to update the source Option in bootstrap-typeahead.js

Question

I am using bootstrap-typeahead in order to allow multiple selection. Here is the demo.

The original code has been update by @Sherbrow Twitter bootstrap typeahead multiple values

My question is related to the following use case:
after inserting Alaska value, I would like to update the source not showing again Alaska value.
Any hints?

Solution 1

I had the same problem and this one will save you a lot of time. I've updated your old jsFiddle with my code example. The basic thing is that you need to do

var autocomplete = $('input').typeahead();
autocomplete.data('typeahead').source = newSource;

Where newSource is the new array. Now you just need a function that adds or removes an element, or whatever you need to do with it.

Solution 2

None of the given answers worked for me, I had to destroy the original typeahead instance and re initialize it.

$('input').typeahead('destroy').typeahead(options);

Solution 3

Based on the default updater method of typeahead :

updater: function (item) {
  var pos = this.source.indexOf(item);
  if(pos != -1) {
    var newSource =
      this.source.slice(0,pos)
      .concat(this.source.slice(pos+1));
    this.source = newSource;
  }
  return item
}

Demo with multiple values (jsfiddle)

Keep in mind that you can access this source from anywhere with $('sel').data('typeahead').source considering that the typeahead is initialized

Comments

[user2847749]

note!! You can also do this for updater. ` var newUpdater = function(item) {} autocomplete.data('typeahead').updater = newUpdater; ` You rock man, i've been working on this for days!!

[wanaryytel]

Yup, the only one working for me as well. Using typeahead.js 0.10.5.

[ItayB]

I'm using typeahead.js 0.11.1 (bundle) and it's not working for me :-(