configuring jquery autocomplete with foundation

Question

I configured jquery autocomplete with the rails4-autocomplete gem

Controller

class SuggestionsController < ApplicationController
  autocomplete :school, :name
end

Routes

resources :suggestions do
  get :autocomplete_school_name, :on => :collection
end

View

<div>
  <%= f.label :school %>
  <%= f.autocomplete_field :school, autocomplete_school_name_suggestions_path %>
</div>

The problem is, is that the the view is rendering the autocomplete incorrectly with foundation. Currently, as shown below, the autocomplete suggestions is begin recommending below the label, and above the autocomplete field.

Answer 1

It looks like you're missing the jQueryUI CSS, so be sure you have this in your application.css:

*= require jquery.ui.autocomplete