Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
An easy and unobtrusive way to use jQuery's autocomplete with Rails 3
Ruby JavaScript HTML CSS

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
lib
test
.gitignore
README.markdown
Rakefile
init.rb
rails3-jquery-autocomplete.gemspec

README.markdown

rails3-jquery-autocomplete

An easy way to use jQuery's autocomplete with Rails 3

Before you start

Make sure your project is using jQuery-ui with the autocomplete widget before you continue.

You can find more info about that here:

I'd recommend you understand what's happening with those 3 tools before attempting to use this gem.

Installing

Include the gem on your Gemfile

gem 'rails3-jquery-autocomplete', '>= 0.1.3', :require => 'autocomplete'

Install it

bundle install

Run the generator

rails generate autocomplete

And include autocomplete-rails.js on your layouts

javascript_include_tag "autocomplete-rails.js"

Usage

Controller

To set up an action on your controller, all you have to do is call it with the object name and the method as in the following example:

class ProductsController < Admin::BaseController
  autocomplete :brand, :name
end

This will magically generate an action autocomplete_brand_name, so, don't forget to add it on your routes file

resources :products do
  get :autocomplete_brand_name, :on => :collection
end

By default, the search starts from the beginning of the string you're searching for. If you want to do a full search, set the full parameter to true.

class ProductsController < Admin::BaseController
  autocomplete :brand, :name, :full => true
end

The following list would match the term query 'un':

  • Luna
  • Unacceptable
  • Rerun

View

On your view, all you have to do is include the attribute autocomplete on the text field using the url to the autocomplete action as the value. form_for @product do |f| f.text_field :brand_name, :autocomplete => autocomplete_brand_name_products_path end

This will generate an HTML tag that looks like:

<input type="text" autocomplete="products/autocomplete_brand_name">

Now your autocomplete JS code is unobtrusive, Rails 3 style.

And... That's it!

Something went wrong with that request. Please try again.