Ruby on Railsで自動生成されたViewに検索フォームを追加する
「Ruby on Rails + PostgreSQLで出発進行!」でRuby on Railsを利用した最初のWebアプリケーションを作成しました。
作成したWebアプリケーションでは、データの追加、編集、削除を行うことができました。今回は、データを検索する機能を追加してみたいとおもいます。
作業手順は、次のとおりです。
(1)キーワードを入力して検索を行うフォームをViewに追加する
(2)検索結果のリスト表示画面から、全リストを表示する画面へのリンクをViewに追加する
(3)検索キーワードを取得して、データベースのデータを検索するControllerを追加する
それでは、順番にコーディングしていきましょう。
(1)キーワードを入力して検索を行うフォームをViewに追加する
Rails Navigatorタブからapp->views->contacts->list.rhtmlを開いてください。
list.rhtmlで検索フォームを配置したい場所に次のコードを追加します。
<%= start_form_tag :action => 'search' %>
<%= text_field :item, :title, :value => @keyword %>
<%= submit_tag 'Search' %>
<%= end_form_tag %>
(説明)
フォームは、start_form_tag と end_form_tagで作成しています。
:action => 'search' でフォームの submit ボタンが押されたときに実行されるアクションを
指定しています。「search」がどのような振る舞いをするかは、(3)のところで定義します。
text_fieldは、テキストフィールドを作成しています。
:itemおよび:titleは、フォームに入力された値を
item というオブジェクト(クラスはModelとして定義されている)のtitle要素として渡すということを
意味しています。
サブミットボタンは、submit_tagで作成しています。
submit_tagに続く、'Search'はボタンに表示する名前を指定しています。
:value => @keywordは、検索に利用したキーワードをインスタンス変数@keywordに格納しています
(たぶん、searchメソッドで格納してます)。
(2)検索結果のリスト表示画面から、全リストを表示する画面へのリンクをViewに追加する
引き続き、list.rhtmlを編集します。リンクを表示したい場所に、次のコードを追加します。
<%= link_to 'All items', :action => 'list' if @keyword %>
(説明)
@keywordがnilでなければリンクをAll itemsというリンクを表示します。
表示には、Controller(ItemsController.rb)dで定義されているlistメソッドを実行することで
実現しています。
(3)検索キーワードを取得して、データベースのデータを検索するControllerを追加する
Rails Navigatorタブからapp->controllers->items_controller.rbを開いてください。
ここに次のコードを追加します。
def search
@items_pages, @items = paginate :items, :per_page => 10,
:conditions => ["title LIKE ?", '%' + params[:item][:title] + '%' ]
@keyword = params[:item][:title]
render :action => 'list'
end
(説明)
Webアプリケーションでは、件数の多い項目を複数のページに分割して、「次のページへ」「前のページへ」と
リンクを表示することがよくあります。このナビゲーションを実際につくるのは結構手間がかかります。
Ruby on Railsでは、paginateというメソッドを利用すること簡単に実現できます(あっぱれ!)。
paginateの引数は、それぞれ以下のことをあらわしています。
per_page 表示項目の1ページあたりの件数
conditions データベースから、データを選択(SELECT)してくるSQL文におけるwhere句の内容
[]内の左にある?のなかに、右側の表現が挿入されるっぽいです。
(参考)LIKE条件において%は「任意の文字数の任意の文字」
戻り値として以下の値が返されます。
@items_pages ページ管理オブジェクト(ページに関する各種情報)
@items 検索結果のモデルのインスタンスの配列
renderは、コントローラからアクションで指定したビューを表示します。
以上のコードを追加したら、変更を保存してアプリケーションにアクセスしてみてください。検索フォームで指定したキーワードがtitleに含まれている、データを検索することができるようになったとおもいます。
お疲れさまでした。