Ruby on RailsのRJSでかんたんAjax開発（前編）
〜パターンとライブラリで作るAjaxおいしいレシピ（出前編）〜

かんたんAjax開発をするための
Ruby on Railsの基礎知識

志田裕樹
株式会社アークウェブ

2008/8/25

■ ActiveRecordを使ったデータの取得

- PR -

　show()アクションメソッド内の冒頭で実行している以下の部分でCategoryクラス（scaffoldで生成されたapp/models/category.rb）の、クラスメソッドfind()呼び出しています。

    @category = Category.find(params[:id])

　Categoryクラスの内容は、次のように非常にシンプルです。

class Category < ActiveRecord::Base

end
app/models/category.rb

　CategoryクラスはActiveRecord::Baseクラスを継承しています。ActiveRecordは、O/Rマッピングツールの1つで、設定ファイルを記述しなくとも、クラス名とテーブル名の命名から自動的にマッピングができるのが大きな特徴の1つです（Railsのコンセプト「設定よりも規約」の一例）。

　今回は、クラス名「Category」とテーブル名の「categories」が自動的に対応付けらます。

　ActiveRecordのfind()メソッドは、categoriesテーブルに対してSELECT文を発行し、結果をCategoryクラスのインスタンスにマッピングして返すメソッドです。

　paramsは、ApplicationControllerが提供する、リクエストパラメータを受け取るためのメソッド（参考の「Parameters」の章）です。params[:id]の部分で、以下の【ID】に指定された値を受け取ることができます。

http://【Railsをインストールしたマシンのアドレス】:3000/categories/【ID】

　このIDを指定してfind()を呼び出すと、合致するidを持つレコードが検索され、そのレコードの内容がセットされたCategoryクラスのインスタンスが戻り値として取得できます。ActiveRecordは、マッピングされたテーブルのカラム名を取得し、Categoryクラスに対して、以下のようなカラムの値の取得や、値の設定の手段を簡単に行うインターフェイスを提供してくれます。

    @category.name
    @category.description = "..."

　これを通じて検索結果を簡単に取得したり、またデータを簡単に更新したりできる仕組みになっています。ActiveRecordの詳細に興味があるなら、「Class: ActiveRecord::Base
」を参照してください。

■ コントローラーからビューの呼び出し

　コントローラーのコードをもう一度見てみましょう。

    @category = Category.find(params[:id])

　「@変数名」という記述は、Rubyではクラスのインスタンス変数を表します（参考）。

　コントローラーのメンバ変数に代入されたものは、ビューでも利用できる仕組みになっていますので、コントローラーからビューへ、変数の受け渡しに利用できます（参考「 ActionController::Base」の「Renders」の章）。

　次に、下記コードを見てみましょう。

    respond_to do |format|
        format.html # show.html.erb
        format.xml { render :xml => @category }
    end

　このrespond_to()メソッドでは、ビューの呼び出し方を指定しています。

　先ほど、「このアクションメソッドは、以下の両方でアクセスされる」と説明しました。

  • /categories/［ID］
  • /categories/［ID］.xml

　Railsでは、URLに拡張子「xml」が付いた場合は、クライアントはXML形式のレスポンスを期待していると解釈して、XML用のレスポンスを用意しようとします。特に拡張子が付かなければHTMLが返されます。

　このようにRailsは、同じアクションメソッド内で、Webブラウザだけでなく、Web APIクライアントなどにも簡単に応答できる仕組みを提供しています（「同じことを繰り返さない」の一例）。この仕組みは後編で、RJS対応をする際に利用します。Railsのrespond_toの仕組みの詳細に興味があるならこちらを参照してください。

■ ビュー（HTML用）のコードを確認

　CategoriesControllerのshow()アクションメソッドのHTMLレスポンスに対応するテンプレートファイルは、scaffoldで生成された次のファイルです。

app/views/categories/show.html.erb
              コントローラー名
                           アクションメソッド名
                                              レスポンス形式
<p>
  <b>Name:</b>
  <%=h @category.name %>
</p>

<p>
  <b>Description:</b>
  <%=h @category.description %>
</p>

<%= link_to 'Edit', edit_category_path(@category) %> |
<%= link_to 'Back', categories_path %>

　このテンプレートはPHPの<?php ?>などと同様に、「<%= …… %>」の中に、Rubyコードを記述できる書式になっており、ユーザーにはRubyコードの実行結果に置き換えられたものが返される仕組みになっています。

　変数「@category」は、 CategoriesControllerの「@category = Category.find(params[:id])」でセットした@categoryと同一オブジェクトです。

　Railsのerbの仕組みの詳細に興味があるなら、以下を参照してください。

■ ヘルパメソッドを使ったHTMLタグの生成

　Railsにはビュー内でよく使われる記述（HTMLタグなど）の生成をしてくれるヘルパメソッドと呼ばれるメソッド群があります。以下のように、show.html.erbで利用されていたlink_to()もヘルパメソッドです（参考）。

<%= link_to 'Edit', edit_category_path(@category) %>

　link_toは<a>タグを生成するもので、次のようなHTMLタグが生成されます。

<a href="/categories/523709510/edit">Edit</a>

　edit_category_pathは、RailsのREST対応で自動的に生成されたヘルパメソッドで、渡された引数「@category」に対応したカテゴリ詳細画面のURLを返すメソッドです。

　ヘルパメソッドの詳細に興味があるなら、「Module: ActionController::Helpers::ClassMethods」を参照してください。

　scaffoldで生成されたひな型を修正

　ここからは、scaffoldで生成されたひな型を修正していきます。

■ カテゴリ一覧データの取得

　サンプルでは、カテゴリ詳細画面の上部にカテゴリ名一覧が表示されているので、これが表示されるように修正してみます。次の流れになります。

  1. コントローラー内で全カテゴリのデータを取得しビューに渡す
  2. ビューで全カテゴリのデータを描画する

　1を実現するには、またActiveRecordのfind()メソッドを使用します。CategoriesControllerクラスのshow()アクションメソッド内に、次の1行を追加しました。

def show
    @categories = Category.find(:all) // この行を追加
    @category = Category.find(params[:id])

　「Category.find(:all) 」は、categoriesテーブルの全レコードを取得し、Categoryクラスのインスタンスの配列として返します（参考）。

■ パーシャル（部分テンプレート）を使った描画

　ビューで全カテゴリのデータを描画するために、今回はRailsの部分テンプレートの仕組み「パーシャル」を使います。「app/views/categories/show.html.erb」の先頭に次の記述を追加しました。

<ul id='categories'>
  <%= render({:partial => "category", :collection => @categories}) %>
</ul>

　このrender()メソッドは、部分テンプレートcategoryで、「@categories内のCategoryインスタンスそれぞれを使って繰り返し描画を行う」という意味です（参考）。

　今回の部分テンプレート名は「category」としました。部分テンプレートファイルとして、以下のように、部分テンプレート名に「_」（アンダーバー）を付けたファイル名で用意します。

  • app/views/categories/_category.html.erb

　部分テンプレート内では、「category」という変数で、現在描画を行っているカテゴリにアクセスできます。部分テンプレートの内容を次のようにしました。

<li><%= link_to(category.name, category_path(category)) %></li>

　category_pathは、RailのREST対応で自動的に生成されたヘルパメソッドで、渡された引数のCategoryインスタンスに対応したカテゴリ詳細画面のURLを返すメソッドです（参考）。

　画面を確認してみましょう。

図5　更新されたカテゴリ詳細画面
図5　更新されたカテゴリ詳細画面

　カテゴリ詳細画面の上部にカテゴリ名一覧が表示され、クリックすると、そのカテゴリ詳細画面に遷移するようになりました。

　細かく規定された開発手法で非常に高い生産性

　今回はRuby on RailsのRJSを使用したAjaxの開発を理解する足掛かりとして、Ruby on Railsそのものの解説をしてきました。Railsは開発手法が細かく規定されており、これに沿って開発することで非常に高い生産性を実現します。

　今回は、たくさんのRails流のルールを知る必要があったため、RJSの解説まで至ることができませんでしたが、次回はRJSの開発をメインに行っていきますので、どうぞお楽しみに！

4/4
  

Index
かんたんAjax開発をするためのRuby on Railsの基礎知識
  Page1
いまさら聞けないRuby on Railsとは？
コラム　「Rubyを使う予定はない」という方へ
Railsを使ったアプリケーション開発の基本的な手順
RubyとRailsのインストール
開発用ディレクトリの作成
  Page2
scaffoldでひな型ソースコードを自動生成
  Page3
scaffoldからRailsの組み方を学ぶ
Page4
scaffoldで生成されたひな型を修正
細かく規定された開発手法で非常に高い生産性

Ruby on RailsのRJSでかんたんAjax開発
　Ruby／Rails関連記事
プログラミングは人生だ
まつもと ゆきひろのコーディング天国　ときにプログラミングはスポーツであり、ときにプログラミングは創造である。楽しいプログラミングは人生をより実りあるものにしてくれる
生産性を向上させるRuby向け統合開発環境カタログ
Ruby on Rails 2.0も強力サポート　生産性が高いと評判のプログラミング言語「Ruby」。統合開発環境を整えることで、さらに効率的なプログラミングが可能になる
かんたんAjax開発をするためのRailsの基礎知識
Ruby on RailsのRJSでかんたんAjax開発（前編）　実はAjaxアプリケーション開発はあなたが思うよりも簡単です。まずはRuby on Railsの基礎知識から学びましょう
Praggerとnetpbmで作る画像→AA変換ツール
Rubyを使って何か面白いものを作ってみよう！　一般的な画像をアスキーアートに変換するツールを作ってみる。さらに出力にバリエーションを持たせてみよう
コードリーディングを始めよう
Railsコードリーディング〜scaffoldのその先へ〜（1）　優れたプログラマはコードを書くのと同じくらい、読みこなす。優れたコードを読むことで自身のスキルも上達するのだ
　　Coding Edgeフォーラムフィード　 2.0／1.0／0.91

TechTargetジャパン

Coding Edge フォーラム 新着記事

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）

RSSフィード

＠IT 新着記事

キャリアアップ

＠IT Sepcial
→ ＠IT Special ヘ

イベントカレンダー

PickUpイベント

- PR -
もっと見る

お勧め求人情報

ホワイトペーパー（TechTargetジャパン）

＠IT Sepcial
→ ＠IT Special ヘ
ソリューションFLASH