mergulhao.info
Por Sylvestre Mergulhão
Sylvestre Mergulhão é programador web e fundador da HE:labs.
Veja também minhas palestras no Speaker Deck e me acompanhe no twitter @smergulhao.
Autocomplete simples para Rails 3 com jQuery
Postado em 04/01/2011
Autocomplete é uma ferramenta muito útil em um aplicativo web. Tanto para manter a consistencia dos dados quanto para facilitar a vida do usuário.
A gem rails3-jquery-autocomplete torna a implementação do autocomplete no rails 3 bem simples.
Antes de começar, verifique se você já está incluindo o jQuery e o jQuery.ui em seu layout, pois eles são pre-requisito para essa gem.
Se estiver tudo ok, vamos ao trabalho. Para começar, os passos básicos:
Adicione a gem ao seu Gemfile:
gem 'rails3-jquery-autocomplete'
Dê um:
bundle install
Rode o generator:
rails generate autocomplete
E inclua o javascript em seu layout:
javascript_include_tag "autocomplete-rails.js"
Então, com tudo configurado partimos para a utilização.
Digamos que nós tivessemos os modelos Product e Category e quisessemos fazer autocomplete do nome da categoria nos formulários dos produtos.
Note que o campo category do modelo Product precisa ser um campo de texto. Para fazer autocomplete em um campo que é chave estrangeira a abordagem é um pouco diferente, e vai ficar para um próximo post.
Seguindo. O próximo passo é adicionar no products_controller.rb:
autocomplete :category, :name
Isso cria uma action chamada autocomplete_category_name que retorna um json com os valores possiveis para o campo name.
Inclua a action nas rotas:
resources :products do
get :autocomplete_category_name, :on => :collection
end
Nas views você só precisa substituir o text_field pela tag autocomplete_field, como no exemplo:
form_for @product do |f|
f.autocomplete_field :category_name, autocomplete_category_name_products_path
end
E é só. Você tem um autocomplete pronto e funcional.