**目次 [#w2f203b2]
#contents
** 掲示板をAjaxにする [#m6f840c2]
|カテゴリー|掲示板をAjaxにする|
|優先順位|至急|
|イテレーション|[[イテレーション1]]|
|状態|未着手|
|完了予定日||
|状態|完了|
|完了予定日|2007/9/3|
|工数||
|対応者|清原|
----
** サーバー側で次のようにPHPを組んでおく [#ga7aae07]
モード1: GETパラメータにpageというパラメータがない場合
処理: 1. 最初のページの記事をBoardClass2から受け取りboard2.tplを使って描画する
モード2: GETパラメータにpageというパラメータがある場合
処理: 1. 与えられたpageパラメータのページのコメントをBoardClass2から受け取る
2. あたらしくcomments.tplというテンプレートを用意しそれを使って、受け取ったコメントを表示する
** ページ上の「次へ」をクリックするとAjaxを使って次のページを表示するようにする [#pac2f37e]
- ページが読み込まれたら、「次へ」のリンクのonclickイベントに次のようなハンドラ関数をセットする
-- bard2.php?page=次のページへXMLHTTPRequestを使ってアクセス
-- 結果を受け取り、その結果で、記事一覧及びページング部分を差し替える。
**プログラム [#db535233]
var ReWrite = function(){
window.onload = this.OnLoadWindow;
}
ReWrite.prototype ={
OnLoadWindow: function(){
var tag = document.getElementsByTagName('a');
var ulr = document.links[0].search;
tag[0].onclick = function() {func.MakeRequest('board.php'+ulr);return false;};
},
MakeRequest: function(url){
var http_request = false;
if(window.XMLHttpRequest){
http_request = new XMLHttpRequest();
}else if(window.ActiveXObject){
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
http_request = new ActiveXobject("Microsoft.XMLHTTP");
} catch(e){
}
}
}
if (!http_request){
alert('Cannot create XMLHTPP instance');
return false;
}
http_request.onreadystatechange = function(){func.ViewContent(http_request);};
http_request.open('GET',url,true);
http_request.send(null);
},
ViewContent: function(http_request){
if (http_request.readyState == 4){
if(http_request.status == 200){
var doc = http_request.responseText;
document.getElementById('result').innerHTML = doc;
}else{
alert('NG');
}
}
}
}
var func = new ReWrite();
![[PukiWiki]](image/sandbox.gif "[PukiWiki]")
