页面部分:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Config Folder Page</title>
<link rel="stylesheet" rev="stylesheet" href="web/css/style.css"
type="text/css" />
<script src="web/js/ajax.js" type="text/javascript"></script>
</head>
<body>
<div id="wrapper">
<div id="branding">
<table width="100%">
<tr>
<td><img src="web/img/logo.gif" /></td>
<td align="right"><a href="ShowPicture"><img
src="web/img/showpicture.gif" /></a></td>
</tr>
<tr>
<td colspan=2>
<hr>
</td>
</tr>
</table>
</div>
<div id="content">
<table border="1">
<tbody id="folderList">
</tbody>
</table>
</div>
<div id="navi">
<form name="configForm">
<div><input type="text" name="newFolderName" /></div>
<div><input type="button" value="Add Folder"
onclick="addNewFolder()" /></div>
<div><input type="text" name="pageSize" /></div>
<div><input type="button" value="change PageSize"
onclick="changePageSize()" /></div>
<div>
<div><input type="text" name="newTagName" /></div>
<div><input type="button" value="Add Tag"
onclick="addNewTag()" /></div>
<div>
<table border="1">
<tbody id="tagList">
</tbody>
</table>
</div>
</form>
</div>
</div>
</body>
</html>
<script LANGUAGE="JavaScript">
<!--
function addNewFolder(){
var theForm=document.forms["configForm"];
var newFolderName=theForm.elements["newFolderName"].value;
// Check
if(newFolderName==null || newFolderName.length<1){
return;
}
// alert(newFolderName);
ajaxObj=createAjaxObject();
var url=prjName+"AddFolder?newFolderName="+newFolderName;
ajaxObj.open("Get",url,true);
ajaxObj.onreadyStateChange=addNewFolderCallBack;
ajaxObj.send(null);
}
function addNewFolderCallBack(){
if(ajaxObj.readyState==4){
if(ajaxObj.status==200){
// Add Row and First Column
var newFolderName=ajaxObj.responseXML.getElementsByTagName("folderInfo")[0].firstChild.data;
var row=document.createElement("tr");
row.setAttribute("id",newFolderName);
var cell=document.createElement("td");
cell.appendChild(document.createTextNode(newFolderName));
row.appendChild(cell);
// Add Delete Column
var deleteButton=document.createElement("input");
deleteButton.setAttribute("type","button");
deleteButton.setAttribute("value","delete");
deleteButton.onclick=function(){deleteFromFolderList(newFolderName);};
cell=document.createElement("td");
cell.appendChild(deleteButton);
row.appendChild(cell);
// Refresh Folder List
document.getElementById("folderList").appendChild(row);
// Clear InputBox
document.getElementById("newFolderName").value="";
}
}
}
function deleteFromFolderList(id){
if(id!=null){
if(confirm("Are you sure to delete this row?")){
var rowWillDelete=document.getElementById(id);
var folderList=document.getElementById("folderList");
folderList.removeChild(rowWillDelete);
}
}
}
function addNewTag(){
var theForm=document.forms["configForm"];
var newTagName=theForm.elements["newTagName"].value;
// Check
if(newTagName==null || newTagName.length<1){
return;
}
// alert(newFolderName);
ajaxObj=createAjaxObject();
var url=prjName+"AddTag?newTagName="+newTagName;
ajaxObj.open("Get",url,true);
ajaxObj.onreadyStateChange=addNewTagCallBack;
ajaxObj.send(null);
}
function addNewTagCallBack(){
if(ajaxObj.readyState==4){
if(ajaxObj.status==200){
// Add Row and First Column
var newTagName=ajaxObj.responseXML.getElementsByTagName("tagInfo")[0].firstChild.data;