back
複数モデルを連携処理する (3/6)
■MsgDataの作成機能を作る
では、MsgDataを作成するページを用意しましょう。ここでは、addmsg.htmlとして投稿のフォームを用意することにします。
このページでは、「addmsg.html?id=番号」というようにアクセスすることで、指定のListDataがフォームに設定され、そのListDataに対するコメントが保存されるようにします。ページがロードされると、initialが呼び出され、指定のIDのListDataが呼び出されます。そしてcallback関数で、取得されたデータからタイトルとID番号を、<div>タグおよび非表示フィールドに設定します。
後は、コメントを書いて送信すると、/addmsgにフォームが送られ、ここでMsgDataの作成がされるようになる、というわけです。
このページでは、「addmsg.html?id=番号」というようにアクセスすることで、指定のListDataがフォームに設定され、そのListDataに対するコメントが保存されるようにします。ページがロードされると、initialが呼び出され、指定のIDのListDataが呼び出されます。そしてcallback関数で、取得されたデータからタイトルとID番号を、<div>タグおよび非表示フィールドに設定します。
後は、コメントを書いて送信すると、/addmsgにフォームが送られ、ここでMsgDataの作成がされるようになる、というわけです。
(by. SYODA-Tuyano.)
※リストが表示されない場合
AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。
※addmsg.htmlのソースコード
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>MsgDataの追加</title>
<script type="text/javascript" src="lib.js"></script>
<script type="text/javascript">
<!--
function initial(){
var datas = getQuery();
getData(datas.id);
}
function callback(request){
var arr = eval(request.responseText);
var data = arr[0];
document.getElementById("id").value = data.id;
document.getElementById("title").innerHTML = data.title + ' (' + data.url + ')';
}
//-->
</script>
</head>
<body onload="initial();">
<h1>メッセージの追加</h1>
<form method="post" action="/addmsg">
<table>
<input type="hidden" id="id" name="id">
<tr><th>TITLE:</th><td><div id="title"></div></td></tr>
<tr><th>Message:</th><td><input type="text" name="message"></td></tr>
<tr><th></th><td><input type="submit" value="追加"></td></tr>
</table>
</form>
</body>
</html>
※web.xmlへの追記
<servlet>
<servlet-name>add_msg</servlet-name>
<servlet-class>jp.tuyano.AddMsgDataServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>add_msg</servlet-name>
<url-pattern>/addmsg</url-pattern>
</servlet-mapping>
| << 前へ | 次へ >> |