テキストフィールドのオートコンプリート

Rails で RJS を使うと簡単にテキストフィールドでオートコンプリートのドロップダウンを表示させることができる。

たとえば、Users テーブルからこれまでに入力された名前と部分一致するものを表示するには以下のようにする。

TodoItems テーブル
  create table users (
    id int auto_increment primary key,
    name varchar(100)
  );
Controller
 class ShowController < ApplicationController
   auto_complete_for :user, :name
 end
View
  <%= text_field_with_auto_complete :user, :name %>

こうするだけでテキストフィールドに文字を入力するたびに、テーブルからデータを取得してドロップダウンを表示してくれるようになる。


なお、デフォルトのオプション設定は以下のとおり。

  • テキストフィールドに入力された文字列の部分一致検索
  • 指定されたフィールドの降順
  • 取得した順に10個までのリストを表示

これらを変更する場合はオプションに :conditions, :order, :limit で指定する。

例えば、ユーザ名の前方一致、名前の昇順、リストには15個まで表示する場合以下のようにする。

View
  <%= text_field_with_auto_complete :user, :name, 
          :conditions => [ "LOWER(#{method}) LIKE ?", params[:user][:name].downcase + '%' ],
          :order => "name DESC",
          :limit => 15 %>

その他、引数に使用できるオプションは Active::Record.Base.find と同じ。