• 追加された行はこの色です。
• 削除された行はこの色です。
• JavaScript/とりあえずajaxしてみる へ行く。
• JavaScript/とりあえずajaxしてみる の差分を削除

*関連 [#x4879276]
-JavaScript
-jQuery
-ajax

*概要 [#o685770d]
ajaxの枠組みがないフレームワーク等の環境でとりあえずajaxさせたいときのTips。

- 前提条件が次のような感じだとして
-- ajaxする仕組みが特別ない
-- ページを出力する枠組みしかない
-- jQueryが使える

*方法 [#af8d7533]

- ページをふたつ作る
-- ajaxしたいページ
-- 動的に切り替わる要素を書いたページ(別ページ)
- ajaxしたいページから別ページを呼ぶ
-- $.ajax()を使う(jQeury)
- ajaxしたいページの要素を書き換える
-- 別ページの要素を選択して
-- ajaxしたいページに入れ込む

 var formData = $(フォームのセレクタ).serializeArray();
 $.ajax({
 	type: 'POST',
 	url: 別ページのURL,
 	data: formData,
 	dataType: 'html',
 	cache: false,
 	success: function(html) {
 		var div = $(html).filter(抜き出したい要素のセレクタ);
 		// 正常時
 		if ($(div).size() > 0) {
 			$(入れ込みたい要素のセレクタ).html($(div).html());
 		}
 		// エラー時（抜き出したい要素が拾えないとき）
 		else {
 			alert('ダメでした。');
 		}
 	},
 	// エラー時（通信的エラーのとき）
 	error: function(XMLHttpRequest, textStatus, errorThrown) {
 		alert('ダメでした。');
 	}
 });

*解説 [#y312488d]
 $(フォームのセレクタ).serializeArray()
JSON形式のデータ構造を取得する。

 $.ajax({
 	・
 	・
 	・
   success: function(){},
     error: function(){}
 });
ajaxして成功時、失敗時の関数をそれぞれ実行する。

 $(html).filter(抜き出したい要素のセレクタ);
読み込んだページから要素を選択する。

*参考 [#x2efb875]
- http://semooh.jp/jquery/api/ajax/serializeArray/+/
- http://semooh.jp/jquery/api/ajax/jQuery.ajax/options/
- http://semooh.jp/jquery/api/traversing/filter/expr/