Typeahead not sending requests to server

Question

I followed this tutorial https://shellycloud.com/blog/2013/10/adding-search-and-autocomplete-to-a-rails-app-with-elasticsearch

and when i type in the text field, i don't see any ajax requests being sent to the server. (I added the typeahead.js to my assets)

What am i missing?

Here is my code

view:

.col-xs-12.col-sm-12.col-md-12.col-lg-6.col-lg-offset-3
  %form#search_form{action: "/drugs/search", method: "get", text: "search", role:"search"}
    .input-group
      %input.form-control{type: "text", placeholder: "Search", name: "query", id: "drug_search", autocomplete: "off"}
      %span.input-group-btn
        %button.btn.btn-default{type: "submit"} Search
  .panel-group#drug-list
    = render @drugs
    = will_paginate @drugs, renderer: BootstrapPagination::Rails

controller:

  def autocomplete
    render json: Drug.search(params[:query], autocomplete: true, limit: 6).map(&:generic_name)
  end

js

$ ->
  $("#drug_search").typeahead
    name: "drug"
    remote: "/drugs/autocomplete?query=%QUERY"

Answer 1

There was a slight API change when v0.10.0 was released. Try this:

var drugSource = new Bloodhound({
  datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.num); },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  remote: '/drugs/autocomplete?query=%QUERY'
});

drugSource.initialize();

$('#drug_search').typeahead(null, {
  name: 'drug',
  source: drugSource.ttAdapter()
});

For more details about what changed with the v0.10.0 release, you can refer to the migration guide.