第5回：Ajaxアプリケーションの作成 (2/4)

Ruby on Rails入門

第５回：Ajaxアプリケーションの作成
著者：アスタリクス大西正太 2006/6/21

Ajaxの実装

それでは前回までに作成したサンプルの検索フォームにオートコンプリート機能を付加してみましょう。

ビューの記述

まず検索フォームの記述がある「list.rhtml」を編集します。ファイルの冒頭でJavaScriptのライブラリを読み込みます。

<%= javascript_include_tag "prototype" %>
<%= javascript_include_tag "effects" %>
<%= javascript_include_tag "controls" %>

続いてテキストフィールド部分の記述を変更します（「text_field」タグを「text_field_with_auto_complete」に書き換え）。なお「:contact」は対応するモデル名、「:name」はその属性名です。

変更前

<%= text_field :contact, :name, :value => @keyword %>

変更後

<%= text_field_with_auto_complete :contact, :name, :value => @keyword %>

コントローラの記述

ContactsControllerにオートコンプリート機能を付加するために、クラス宣言直下にauto_complete_for宣言を記述します。

class ContactsController < ApplicationController
   auto_complete_for :contact, :name

（省略）

end

動作の確認

以上でオートコンプリート機能の付加は完了です。検索ページを表示して、登録されているコンタクト名の頭文字を入力してみてください。すると図1のように表示されます。

図1：オートコンプリートの表示
（画像をクリックすると別ウィンドウに拡大図を表示します）

著者プロフィール
株式会社アスタリクス大西正太
JavaEEフレームワークの設計構築や開発プロセス策定などの業務を経て、現在は新規ビジネス創生に携わる。Ruby on Rails上に構築したオープンソースのCMS「Rubricks」（http://rubricks.org/）のコミッタ。

徹底比較!!Ruby on Rails vs Javaフレームワーク
第1回	O/Rマッピング
第2回	JSFとRailsで比較（前編）
第3回	JSFとRailsで比較（後編）
第4回	DIコンテナとの比較
第5回	テストフレームワーク
第6回	RailsとGrailsの比較（前編）
第7回	RailsとGrailsの比較（後編）