📄 bloglist.jsp

📁 《Ajax开发精要〉〉该书详细的介绍了关于Ajax和java相关的开发知识
💻 JSP
字号:
<%@ page contentType="text/html; charset=gb2312"%>
<%@ page import="com.ajaxlab.ajax.*"%>
<%
BlogService service = new BlogService();
BlogList[] listes = null;
String listid = "";
try {
	listes = service.getAllList();
	if((listes!=null)&&(listes.length!=0)) {
		listid = listes[0].getListid();
	}
}catch(Exception ex) {
	System.out.println(ex.toString());
}
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>AjaxCh09--模拟MSN Space</title>
<link href="../css/style.css" rel="stylesheet" type="text/css">
<script language="javascript" src="../AjaxCh05/ajax_func.js"></script>
<script language="javascript">
var listdoc = null;
var editable = true;
var deleteable = true;
var additemable = true;
/*页面初始化*/
function initial() {
	var listid = "<%=listid%>";
	if(listid!="") {
		send_request("GET","../AjaxCh09/blogManager?action=viewList&listid="+listid,null,"XML",initialDocument);
	}
}
/*自定义列表下拉列表框onchange事件函数*/
function changeList(listid) {
	if(listid!="") {
		editable = true;
		deleteable = true;
		additemable = true;
		send_request("GET","../AjaxCh09/blogManager?action=viewList&listid="+listid,null,"XML",initialDocument);
	}
}
/*初始化DOM对象*/
function initialDocument() {
	if (http_request.readyState == 4) { // 判断对象状态
		if (http_request.status == 200) { // 信息已经成功返回，开始处理信息
			listdoc = http_request.responseXML;
			initialListtitle();
			initialListmenu();
			initialListItem();
			initialAddItem();
		} else { //页面不正常
			alert("您所请求的页面有异常。");
		}
	}
}
/*清空“新建项目”表单*/
function initialAddItem() {
	document.getElementById("newItem").innerHTML = "";
		editable = true;
		deleteable = true;
		additemable = true;
		initialListmenu();
}
/*初始化自定义列表项*/
function initialListItem() {
	var innerHTML = "<table width=\"600\" border=\"0\" cellpadding=\"4\" cellspacing=\"1\" bgcolor=\"#006600\"><tr>";
	innerHTML += "<td width=\"150\" bgcolor=\"#B2E392\">项目</td>";
	innerHTML += "<td width=\"220\" bgcolor=\"#B2E392\">URL</td>";
	innerHTML += "<td width=\"130\" bgcolor=\"#B2E392\">描述</td>";
	innerHTML += "<td width=\"50\" bgcolor=\"#B2E392\">编辑</td>";
	innerHTML += "<td width=\"50\" bgcolor=\"#B2E392\">删除</td></tr>";
	if(listdoc.getElementsByTagName("item").length!=0) {
		var itemes = listdoc.getElementsByTagName("item");
		for(var i=0;i<itemes.length;i++) {
			var itemid = itemes[i].getAttribute("itemid");
			var itemname = (itemes[i].childNodes[0].firstChild==null)?"":itemes[i].childNodes[0].firstChild.data;
			var itemurl = (itemes[i].childNodes[1].firstChild==null)?"":itemes[i].childNodes[1].firstChild.data;
			var description = (itemes[i].childNodes[2].firstChild==null)?"":itemes[i].childNodes[2].firstChild.data;
			innerHTML += "<tr>";
			innerHTML += "<td width=\"150\" bgcolor=\"#B2E392\" id=\""+itemid+".itemname\">"+itemname+"</td>";
			innerHTML += "<td width=\"220\" bgcolor=\"#B2E392\" id=\""+itemid+".itemurl\">"+itemurl+"</td>";
			innerHTML += "<td width=\"130\" bgcolor=\"#B2E392\" id=\""+itemid+".description\">"+description+"</td>";
			innerHTML += "<td width=\"50\" bgcolor=\"#B2E392\" id=\""+itemid+".edit\">";
			if(editable) {
				innerHTML += "<a href=\"javascript:void(0)\" onClick=\"editItem('"+itemid+"')\">";
				innerHTML += "<img src=\"../images/editicon.gif\" border=\"0\" align=\"absmiddle\"></a>";
			}
			else {
				innerHTML += "<img src=\"../images/editicon_disabled.gif\" border=\"0\" align=\"absmiddle\">";
			}
			innerHTML += "</td>";
			innerHTML += "<td width=\"50\" bgcolor=\"#B2E392\" id=\""+itemid+".delete\">";
			if(deleteable) {
				innerHTML += "<a href=\"javascript:void(0)\" onClick=\"deleteItem('"+itemid+"')\">";
				innerHTML += "<img src=\"../images/clearicon.gif\" border=\"0\" align=\"absmiddle\"></a>";
			}
			else {
				innerHTML += "<img src=\"../images/clearicon_disabled.gif\" border=\"0\" align=\"absmiddle\">";
			}
			innerHTML += "</td>";
			innerHTML += "</tr>";
		}
	}
	innerHTML += "</table>";
	document.getElementById("listitem").innerHTML = innerHTML;
	initialAddItem();
}
/*初始化列表标题*/
function initialListtitle() {
	var title = listdoc.getElementsByTagName("list")[0].getAttribute("listname");
	var innerHTML = "<table width=\"600\" border=\"0\" cellpadding=\"4\" cellspacing=\"1\" bgcolor=\"#006600\">";
	innerHTML += "<tr><td bgcolor=\"#B2E392\">"+title+"</td></tr></table>";
	document.getElementById("listtitle").innerHTML = innerHTML;
}
/*初始化列表菜单*/
function initialListmenu() {
	var innerHTML = "<table width=\"600\" border=\"0\" cellpadding=\"4\" cellspacing=\"1\" bgcolor=\"#006600\">";
	innerHTML += "<tr><td bgcolor=\"#B2E392\">";
	if(additemable) {
		innerHTML += "<a href=\"javascript:void(0)\" onClick=\"addItem()\">添加项目</a>|";
	}
	else {
		innerHTML += "添加项目|";
	}
	innerHTML += "重命名列表|删除列表";
	innerHTML += "</td></tr></table>";
	document.getElementById("listmenu").innerHTML = innerHTML;
}
/*编辑列表项目*/
function editItem(itemid) {
	editable = false;
	deleteable = false;
	initialListItem();
	additemable = false;
	initialListmenu();
	var nameinput = 
		"<input type=\"text\" name=\"itemname\" value=\""+document.getElementById(itemid+".itemname").innerHTML+"\" size=\"10\">";
	var urlinput = 
		"<input type=\"text\" name=\"itemurl\" value=\""+document.getElementById(itemid+".itemurl").innerHTML+"\" size=\"20\">";
	var descriptioninput = 
		"<input type=\"text\" name=\"description\" value=\""+document.getElementById(itemid+".description").innerHTML+"\" size=\"10\">";
	var submitbutton = 
		"<input type=\"button\" name=\"submit\" value=\"保存\" onClick=\"submitItem('"+itemid+"')\">";
	var cancelbutton = 
		"<input type=\"button\" name=\"cancel\" value=\"取消\" onClick=\"initialListItem()\">";
	document.getElementById(itemid+".itemname").innerHTML = nameinput;
	document.getElementById(itemid+".itemurl").innerHTML = urlinput;
	document.getElementById(itemid+".description").innerHTML = descriptioninput;
	document.getElementById(itemid+".edit").innerHTML = submitbutton;
	document.getElementById(itemid+".delete").innerHTML = cancelbutton;
}
/*提交所编辑的列表项目*/
function submitItem(itemid) {
	editable = true;
	deleteable = true;
	additemable = true;
	var f = document.forms[0];
	var str = "listid="+listdoc.getElementsByTagName("list")[0].getAttribute("listid");
	str += "&itemid="+itemid;
	str += "&itemname="+f.itemname.value;
	str += "&itemurl="+f.itemurl.value;
	str += "&description="+f.description.value;
	send_request("POST","../AjaxCh09/blogManager?action=updateItem",str,"XML",initialDocument);
}
/*"新建项目"事件函数*/
function addItem() {
	editable = false;
	deleteable = false;
	initialListItem();
	additemable = false;
	initialListmenu();
	var nameinput = 
		"<input type=\"text\" name=\"itemname\" value=\"\" size=\"10\">";
	var urlinput = 
		"<input type=\"text\" name=\"itemurl\" value=\"\" size=\"20\">";
	var descriptioninput = 
		"<input type=\"text\" name=\"description\" value=\"\" size=\"10\">";
	var submitbutton = 
		"<input type=\"button\" name=\"submit\" value=\"添加\" onClick=\"doAddItem()\">";
	var cancelbutton = 
		"<input type=\"button\" name=\"cancel\" value=\"取消\" onClick=\"initialListItem()\">";
	var innerHTML = 
		"<table width=\"600\" border=\"0\" cellpadding=\"4\" cellspacing=\"1\" bgcolor=\"#006600\">";
	innerHTML += 
		"<tr><td bgcolor=\"#B2E392\" height=\"25\" colspan=\"5\">键入您要添加的项目的名称、URL 和描述。名称是必需的；URL 和描述是可选的。请单击“添加”，将项目添加到列表。</td></tr>";
	innerHTML += 
		"<tr><td width=\"150\" bgcolor=\"#B2E392\">名称（必须）<br>"+nameinput+"</td>";
	innerHTML += 
		"<td width=\"220\" bgcolor=\"#B2E392\">URL<br>"+urlinput+"</td>";
	innerHTML += 
		"<td width=\"130\" bgcolor=\"#B2E392\">描述<br>"+descriptioninput+"</td>";
	innerHTML += 
		"<td width=\"50\" bgcolor=\"#B2E392\">"+submitbutton+"</td>";
	innerHTML += 
		"<td width=\"50\" bgcolor=\"#B2E392\">"+cancelbutton+"</td></tr>";
	innerHTML += "</table>";
	document.getElementById("newItem").innerHTML = innerHTML;
}
/*提交所新建的项目*/
function doAddItem() {
	var f = document.forms[0];
	if(f.itemname.value=="") {
		window.alert("项目名称不能为空。");
		f.itemname.focus();
		return false;
	}
	editable = true;
	deleteable = true;
	additemable = true;
	var str = "listid="+listdoc.getElementsByTagName("list")[0].getAttribute("listid");
	str += "&itemname="+f.itemname.value;
	str += "&itemurl="+f.itemurl.value;
	str += "&description="+f.description.value;
	send_request("POST","../AjaxCh09/blogManager?action=addItem",str,"XML",initialDocument);
}
/*删除指定的列表项目*/
function deleteItem(itemid) {
	var listid = listdoc.getElementsByTagName("list")[0].getAttribute("listid");
	if(itemid!="") {
		var conf = window.confirm("您确定要删除这条列表记录吗？");
		if(conf)
			send_request("GET","../AjaxCh09/blogManager?action=deleteItem&listid="+listid+"&itemid="+itemid,null,"XML",initialDocument);
	}
}
</script>
</head>

<body bgcolor="#B2E392" onLoad="initial()">
<form name="form1" method="post" action="">
<table width="600" border="0" cellpadding="4" cellspacing="1" bgcolor="#006600">
    <tr>
        <td bgcolor="#B2E392"><span style="color:#006600">查看：</span>
				<select name="listes" id="listes" style="width:200px" onchange="changeList(this.value)">
				<%
				if((listes!=null)&&(listes.length!=0)) {
					for(int i=0;i<listes.length;i++) {
						out.println("<option value='"+listes[i].getListid()+"'>"+listes[i].getListname()+"</option>");
					}
				}
				%>
				</select>
				</td>
    </tr>
</table>
<br><br>
<label id="listtitle"></label>
<label id="listmenu"></label>
<label id="newItem"></label>
<label id="listitem"></label>
</form>
</body>
</html>
💿 文件大小 436 K
👤 上传用户 norwaybaby
📂 所属分类 Java编程
🏷️ 相关标签

#Ajax #java
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -