title: Restrict input to suggestion
body: <p>Here's my script using <a href="https://github.com/twitter/typeahead.js" rel="nofollow noreferrer">https://github.com/twitter/typeahead.js</a> :    </p>
  
  <pre><code>function typeahead_initialize() {
    var engine = new Bloodhound({
      datumTokenizer: function(datum) {
          var result = Bloodhound.tokenizers.whitespace(datum.name);
          if (datum.brand != null){
              result = result.concat(Bloodhound.tokenizers.whitespace(datum.brand.name));
          }
          return result;
      },
      queryTokenizer: Bloodhound.tokenizers.whitespace,
      remote: {
          wildcard: '%QUERY',
          url: '/find?q=%QUERY%',
          prepare: function(query, settings) {
              settings.type = "GET";
              settings.dataType = "json"
              settings.url = settings.url.replace('%QUERY', encodeURIComponent(query));
              return settings;
          }
      }
  });
  
  $(".search").typeahead(null, {
      name: 'engine',
      display: function(data){
          return  data.name + (data.brand ? " - " + data.brand.name : "");
      },
      source: engine
  })
  .on('typeahead:selected', function($e, datum){
      //You may access the value object here
      console.log("datum" ,datum);
  });
  </code></pre>
  
  <p>}
  Is there any way to only allow the user to use one of the typeahead suggestions for the value? It's because the form input values must match a record in the database on submit and thus, a user should not be able to type in their own custom value.</p>
  
  <p><strong>Update:</strong> There are multiple fields that typehead attaches to and they all have a class of <code>.search</code>. The user can create as many input fields as they like but not remove them from the page. (Kind of like a shopping cart). To do this, I destroy and re-initialize typeahead within the input field create method. If you do not do this, typeahead won't see the newly added input fields. </p>
  
  <pre><code>$('#add_product_field').on('click', function (){
    //Destroy typeahead
    $('.search').typeahead('destroy');
  
    //..add a new input to DOM code
  
    //attach typeahead to all inputs
    typeahead_initialize();
  });
  </code></pre>