這一篇的延伸
主要差異就是結合javascript 和 JSP 來讀取 JDO 的資料
在此設定如下
1. 在JDO中定一個資料表User 包含 Name 和 Content 兩個欄位
2. 建立一個JSP file " testIndex.jsp" , 記得修改 war/WEB-INF/web.xml 的 welcome-file-list 為 testIndex.jsp
其他就不贅述了 直接看看 testIndex.jsp 的結構, 記得要在head 之上 import 些定義好得class
以下會比較一下 testIndex.jsp 中 function show() 在server端撰寫 和編譯後的情況
Server CODE 如下
<%@ page contentType="text/html; charset=Big5" import="
<%@ page import="jsp.jdo.*" %> <%@ page import="jsp.jdo.User" %> <%@ page import="javax.jdo.PersistenceManager" %> <%@ page import="
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=charset=big5">
<title>JSP read JDO file</title>
<script type="text/javascript">
// --------------------------------------------------------- // set httprequest by explorer // ---------------------------------------------------------
XmlsReq = false;
if(window.XMLHttpRequest) {
XmlsReq = new XMLHttpRequest(); // common
} else if(window.ActiveXObject) {
try {
XmlsReq = new ActiveXObject("Msxml2.XMLHTTP"); // ie
} catch(e) {
XmlsReq = new ActiveXObject("Microsoft.XMLHTTP"); // ie
}
}
// --------------------------------------------------------- // Add Http request to add user information // ---------------------------------------------------------
function PostHttpRequestAdd() {
var uri='add';
XmlsReq.onreadystatechange=function() {
if (XmlsReq.readyState==4 && XmlsReq.status == 200) {
alert(XmlsReq.responseText);
}
}
var aUserName = document.getElementById('aUserName').value;
var aUserContent= document.getElementById('aUserContent').value;
var param = "aUserName="+aUserName+"&aUserContent="+aUserContent;
XmlsReq.open("POST",uri,true);
XmlsReq.setRequestHeader('Content-Type', '
XmlsReq.send(param);
}
// ---------------------------------------------------------
// Show the all User in the JDO File by JSP
// ---------------------------------------------------------
function Show() {
var TempString ;
var Size;
<%
/// get Persistence Manager
PersistenceManager pm = PMF.get().getPersistenceManager();
/// set query String
String query = "select from " + User.class.getName() ;
/// start query
ist<User> userAll = (List<User>) pm.newQuery(query).execute();
if(userAll.isEmpty()){
%>
alert("The User has no Item");
<%
}
else { %> Size = <%= userAll.size() %> ;
TempString = new Array(Size);
for(var i = 0; i < Size; i++)
TempString[i] = new Array(2);
<%
for (int i=0;i<userAll.size();i++) {
%>
// save in TempString
// userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[<%= i %>][0]="<%= userAll.get(i).GetName() %>";
TempString[<%= i %>][1]="<%= userAll.get(i).GetContent() %>";
<%
}
}
%>
alert(TempString[3][1]);
}
</script>
</head>
<body>
<h2>讀取JDO File </h2><hr>
<table>
<tr>
<td colspan="2" style="font-weight:bold;">Available Servlets:</td>
</tr>
<tr>
<td><a href="jspjdo"/>jspJDOServlet</td>
</tr>
<tr>
<td colspan="2" style="font-weight:bold;">Add function:</td>
</tr>
<tr>
<td>
請輸入姓名:
<input type=text Id="aUserName">
請輸入Content:
<input type=text Id="aUserContent">
<input type=submit value="確定新增" onclick="PostHttpRequestAdd()">
</td>
</tr>
<tr>
<td colspan="2" style="font-weight:bold;">Show all user:</td>
</tr>
<tr>
<td>
<input type=submit value="顯示所有使用者" onclick="Show()">
</td>
</tr>
</table>
</body>
</html>
Show function 編譯後
// ---------------------------------------------------------
// Show the all User in the JDO File by JSP
// ---------------------------------------------------------
function Show() {
var TempString ;
var Size;
Size = 5 ;
TempString = new Array(Size);
for(var i = 0; i < style="color: rgb(0, 102, 0);">
// save in TempString
// userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[0][0]="null";
TempString[0][1]="null";
// save in TempString // userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[1][0]="null";
TempString[1][1]="null";
// save in TempString // userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[2][0]="dg";
TempString[2][1]="gg";
// save in TempString // userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[3][0]="gg";
TempString[3][1]="hh";
// save in TempString // userAll.get(i).GetName() 回傳字串,但javascript 字串要放在雙引號內""
TempString[4][0]="gfjj";
TempString[4][1]="ll";
alert(TempString[3][1]);
}
但可惜的是目前無法將 含有jsp file 的 檔案無放上傳到 google app engine....
可參考 這個議題
jsp 教學可參考 http://caterpillar.onlyfun.net/Gossip/JSPServlet/JSPServlet.htm
1 則留言:
關於 含有jsp file 的 檔案無放上傳到 google app engine....
更新到 GAE 的 plugin 1.2.2 後ok
(之前是用1.2.0 版)
張貼留言