title: using bootstrap typeahead how to include a button
body: <p>I am using bootstrap and typeahead and have it working: When the user types after three chars the dropdown list shows fine. If they click anywhere on the screen or another window the dropdown list goes away. In order to see that list again the user needs to delete one char and put it back for the list to display again.  </p>
  
  <p>What i am looking for help with is, I would like to place a button besides the input that when pressed calls the typeahead (basically showing the list again). I did try one little hack that when the button was pressed to fire an onchange event for the input, but that did not work</p>
  
  <p>thanks for any help</p>
  
  <pre><code>&lt;input autocomplete="off" class="span3" id="search-critera"
             type="text" placeholder="Enter docSet name or docSet id "
             data-provide="typeahead"  &gt;
   &lt;button id="typeahead-but" class="btn btn-small btn-primary"type="button"&gt;
   Search&lt;/button&gt;
  </code></pre>
  
  <p>Here is the js snippet</p>
  
  <pre><code> $('#search-critera').typeahead({
              minLength: 3,
              items: 26,
              source: function(query, process) {
              return $.ajax({
                    url: URLsArray['autocompleteURL'][URLmode],
                    type: 'get',
                    data: ({query: query, limit:25 }),
                    dataType: 'jsonp',
                    success: function(data) {
                                  return process(options);
                              }
                          });
                      },
                    highlighter: function (item) {
                          var foo = item.split('|');
                          return foo[1];
                    },
                    matcher: function (item) {
                          /*
                           * I do not need a matcher since the backend is handling that
                           */
                          return true;
                    },
                    updater: function(selected) {
                          var foo = selected.split('|');
                          self.loadMgrSnip();
                          self.getDocSet( foo[0] );
  
                      }
                  });
  </code></pre>