Gist for Solr with Twitter Typeahead

bootstrap_typeahead_html_fragment.html

<form role="search">
  <div class="form-group">
    <div class="input-group col-sm-6">
      <input id="querytxt" type="text" class="typeahead form-control" /> 
      <span class="input-group-btn">
        <button id="solrsearch" class="btn btn-primary" type="button"><span class="glyphicon glyphicon-search" />
      </span>
    </div>
  </div>
</form>     

bootstrap_typeahead_solr_suggest.js

var dsrc = new Bloodhound({
    datumTokenizer: function(d) {
        return Bloodhound.tokenizers.whitespace(d.value);
    },
    queryTokenizer: Bloodhound.tokenizers.whitespace,
    limit: 10,
    minLength: 3,

    remote: {
        url: 'http://{solrserver:solrport}/solr/{collection}/suggest?q=%QUERY',
        ajax: {
            dataType: 'jsonp',

            data: {
                'wt': 'json',
                'rows': 5
            },

            jsonp: 'json.wrf'
        },
        filter: function(data) {
            console.log(data.spellcheck.suggestions[1])
            return $.map(data.spellcheck.suggestions[1].suggestion, function(data) {
                return {
                    value: data
                };
            });
        }
    }
});

dsrc.initialize();

$('.typeahead').typeahead({
    hint: true,
    highlight: true,
    minLength: 1
}, {
    displayKey: 'value',
    source: dsrc.ttAdapter()
});