目次
●事前準備
●概要
●サンプルのポイント
●サンプルの使い方
●ファイル構成
●ビュー（画面）
●コントローラー
内容
事前準備
JQueryの準備
"ror-tutorial\public\javascripts"フォルダにJQueryサイトからJQueryファイルをダウンロードして"jquery.js"にリネームしてコピーします。
概要
Ajaxを行うアプリケーションです。
入力画面（index.html.erb）
↓
結果画面（index.html.erb）
サンプルのポイント
・JQueryを使用してAjaxします。
サンプルの使い方
サンプルはあらかじめ用意していないので、以降の項目を参照にして、自分で作成しなければいけません。作成後に、ブラウザからhttp://127.0.0.1:3000/ajaxにアクセスしましょう(ポート番号"3000"は適宜、環境に応じて読み替えて下さい)。
ファイル構成
本項で作成するファイル
| ファイル名 | 種類 |
| index.html.erb | ビュー |
| ajax_controller.rb | コントローラー |
ビュー（画面）
入力画面、兼、結果画面を作成しましょう。
"ror-tutorial\app\views\ajax\index.html.erb"ファイルを以下の内容で作成します。
<html>
<head>
<title>Tutorial: Ajax</title>
<%= stylesheet_link_tag 'ror' %>
<%= javascript_include_tag "jquery" %>
</head>
<body>
<h2>Tutorial: Ajax</h2>
<span id="message"></span><br />
<input type="button" value="hello" onclick="$('#message').load('/ajax/hello');"/>
</body>
</html>
コントローラー
"ror-tutorial\app\controllers\ajax_controller.rb"ファイルを以下の内容で作成します。
class AjaxController < ApplicationController
#初期画面表示
def index
render :action => 'index.html.erb'
end
#Ajaxで文字列データを返す
def hello
render :text => "こんにちは"
end
end
