HELP!!!~foundations-of-ajax EmployeeList实例~搞了一晚上还是不行!
一直提示找不到对象,xmlspy显示错误在 xmlHttp.send(null);
代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml/DTD/xhtml-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Student Score List</title>
<script type="text/javascript">
var xmlHttp;
var sno;
var sname;
var dept;
var title;
var math;
var chinese;
var english;
var physics;
var chemistry;
var deleteID;
var STU_PREFIX="stu-";
function createXMLHttpRequest(){
if(window.ActiveXObject){
xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest){
xmlHttp= new XMLHttpRequest();
}
}
function addScore() {
sno = document.getElementById("sno").value;
sname = document.getElementById("sname").value;
dept = document.getElementById("dept").value;
math= document.getElementById("math").value;
chinese= document.getElementById("chinese").value;
english= document.getElementById("english").value;
physics= document.getElementById("physics").value;
chemistry= document.getElementById("chemistry").value;
action = "add";
if(sno == "" || sname == "" || dept == ""|| math == "" || chinese == "" || english == "" || physics == "" || chemistry =="") {
return;
}
var url = "StudentScoreList?"
+ createAddQueryString(sno, sname, dept,math,chinese, english, physics, chemistry ,"add");
+ "&ts=" + new Date().getTime();
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleAddStateChange;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
function createAddQueryString(sno, sname, dept, math,chinese,english,physics,chemistry,action) {
var queryString = "sno=" + sno
+ "&sname=" + sname
+ "&dept=" + dept
+ "&math=" + math
+ "&chinese=" + chinese
+ "&english=" + english
+ "&physics=" + physics
+ "&chemistry=" + chemistry
+ "&action=" + action;
return queryString;
}
function handleAddStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
updateStudentScoreList();
clearInputBoxes();
}
else {
alert("Error while adding scores.");
}
}
}
function clearInputBoxes() {
document.getElementById("sno").value = "";
document.getElementById("sname").value = "";
document.getElementById("dept").value = "";
document.getElementById("math").value = "";
document.getElementById("chinese").value = "";
document.getElementById("english").value = "";
document.getElementById("physics").value = "";
document.getElementById("chemistry").value = "";
}
function deleteStudentScoreList(id) {
deleteID = id;
var url = "StudentScoreList?"
+ "action=delete"
+ "&id=" + id
+ "&ts=" + new Date().getTime();
createXMLHttpRequest();
xmlHttp.onreadystatechange = handleDeleteStateChange;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
function updateStudentScoreList() {
var responseXML = xmlHttp.responseXML;
var status = responseXML.getElementsByTagName("status").item(0).firstChild.nodeValue;
status = parseInt(status);
if(status != 1) {
return;
}
var row = document.createElement("tr");
var uniqueID = responseXML.getElementsByTagName("uniqueID")[0].firstChild.nodeValue;
row.setAttribute("id", STU_PREFIX + uniqueID);
row.appendChild(createCellWithText(sno));
row.appendChild(createCellWithText(sname));
row.appendChild(createCellWithText(dept));
row.appendChild(createCellWithText(math));
row.appendChild(createCellWithText(chinese));
row.appendChild(createCellWithText(english));
row.appendChild(createCellWithText(physics));
row.appendChild(createCellWithText(chemistry));
var deleteButton = document.createElement("input");
deleteButton.setAttribute("type", "button");
deleteButton.setAttribute("value", "Delete");
deleteButton.onclick = function () { deleteStudentScoreList(uniqueID); };
cell = document.createElement("td");
cell.appendChild(deleteButton);
row.appendChild(cell);
document.getElementById("studentScoreList").appendChild(row);
updateStudentScoreListVisibility();
}
function createCellWithText(text) {
var cell = document.createElement("td");
cell.appendChild(document.createTextNode(text));
return cell;
}
function handleDeleteStateChange() {
if(xmlHttp.readyState == 4) {
if(xmlHttp.status == 200) {
deleteStudentScoreListFromList();
}
else {
alert("Error while deleting scores.");
}
}
}
function deleteStudentScoreListFromList() {
var status = xmlHttp.responseXML.getElementsByTagName("status").item(0).firstChild.nodeValue;
status = parseInt(status);
if(status != 1) {
return;
}
var rowToDelete = document.getElementById(STU_PREFIX + deleteID);
var StudentScoreList = document.getElementById("StudentScoreList");
StudentScoreList.removeChild(rowToDelete);
updateStudentScoreListVisibility();
}
function updateStudentScoreListVisibility() {
var StudentScoreList = document.getElementById("StudentScoreList");
if(StudentScoreList.childNodes.length > 0) {
document.getElementById("StudentScoreListSpan").style.display = "";
}
else {
document.getElementById("StudentScoreListSpan").style.display = "none";
}
}
</script>
</head>
<body bgcolor="#F4F5FF" leftmargin="30" topmargin="0">
<h1>Student Score List</h1>
<form action="#">
<table width="20%" border="0">
<tr>StudentNO: <input type="text" id="sno"/></tr>
<tr>Sname: <input type="text" id="sname"/></tr>
<tr>Dept: <input type="text" id="dept"/></tr>
<tr>Math: <input type="text" id="math"/></tr>
<tr>Chinese: <input type="text" id="chinese"/></tr>
<tr>English: <input type="text" id="english"/></tr>
<tr>Physics: <input type="text" id="physics"/></tr>
<tr>Chemistry: <input type="text" id="chemistry"/></tr>
<tr>
<td colspan="3" align="center">
<input type="button" value="Add" />
</td>
</tr>
</table>
</form>
<span id="StudentScoreListSpan" style="display:none;">
<h2>Scores:</h2>
<table border="1" width="20%">
<tbody id="studentScoreList"></tbody>
</table>
</span>
</body>
</html>
|