0
我正在處理一個簡單的HTML表單，該表單檢測記錄是否存在（位於XML文件中）並填充所有字段或檢測到表單沒有存在並提交時，創建記錄（或修改當前的記錄（如果已修改）獲取PHP文件以返回文本/純文本到AJAX調用
我正在處理現在會添加不存在記錄和/或修改現有記錄的部分。
AJAX調用一個PHP文件，並在PHP文件中，我想檢查記錄是否存在，並相應地執行相應的操作。我希望通知表格的用戶（不是雙關語言）進行了什麼操作（即「添加記錄」或「修改記錄」）。
首先，我現在正在執行的PHP操作是返回文本added。我想查看是否可以將「添加記錄」正確顯示在原始HTML文件中。
預期：當我點擊Submit，我希望這些消息補充說：「記錄」或「修改過的記錄」的形式下出現，具體取決於從PHP文件返回。
出現錯誤：現在，當我點擊Submit，形式自身重置，將所有的URL參數，我沒有得到來自AJAX請求的任何消息。
這裏是我的代碼：
HTML頁：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script type="text/javaScript">
function checkID(val){
if (val.value.length != 6) //Since student ID's are six digits
return;
//inID = val.value;
//if (inID.length < 6) return;
xhr = new XMLHttpRequest();
xhr.open('GET', 'processor.php?studentID=' + document.forms[0].elements[0].value);
xhr.onreadystatechange = function() {
/**
if (xhr.readystate != 4 || xhr.status != 200){
document.getElementById("status").innerHTML = "<p> Not Done Yet</p>";
}
**/
if (xhr.readyState === 4 && xhr.status === 200){
document.getElementById("status").innerHTML = "";
parse(xhr.responseXML);
}
}
xhr.send();
document.getElementById("status").innerHTML = "<p> Not Done Yet</p>";
}
function parse(xml){
if (xml == null) alert("Null!");
var student = xml.getElementsByTagName('student');
if (student.length == 0) alert("No Student's Found with that ID");
var content = student.item('0');
var name = content.getElementsByTagName('fullname');
name = name.item(0).childNodes[0].nodeValue;
document.forms[0].elements[1].value = name;
var phone = content.getElementsByTagName('phone');
phone = phone.item(0).childNodes[0].nodeValue;
document.forms[0].elements[2].value = phone;
var email = content.getElementsByTagName('email');
email = email.item(0).childNodes[0].nodeValue;
document.forms[0].elements[3].value = email;
}
function addOrModify(curr){
xhr2 = new XHRHttpRequest();
xhr2.open('GET', 'addOrModify.php'); //?studentID=' + document.forms[0].elements[0].value);
xhr2.onreadystatechange = function(){
if (xhr2.readyState === 4 && xhr2.status === 200){
if (xhr.responseText == "added") {document.getElementById("status").innerHTML = "<p>Added the Record</p>"};
}
}
xhr.send();
return false;
}
</script>
<style type="text/css">
#container {
margin: 0 auto;
padding: 30px;
text-align: center;
}
.centerp {
font-size: 150%;
text-align: center;
}
table {
align: center;
}
</style>
<title>Student Profile</title>
</head>
<body>
<p class="centerp"> Student Profiles </p>
<div id="container">
<form>
<table align="center">
<label>
<tr>
<td>Student ID</td>
<td><input type="text" name="studentID" onblur="checkID(this)"> </input></label></td>
</tr>
</label>
<label>
<tr>
<td>Name</td>
<td><input type="text" name="name" id="name"> </input></label></td>
</tr>
</label>
<label>
<tr>
<td>Phone</td>
<td><input type="text" name="phone"> </input></label></td>
</tr>
</label>
<label>
<tr>
<td>Email</td>
<td><input type="text" name="email"> </input></label></td>
</tr>
</label>
<tr>
<td> <input type="submit" onclick="return addOrModify()"> </input></td></tr> </td>
</tr>
<tr>
<td> <div id="status">
</div> </td>
</tr>
</table>
</form>
</div>
</body>
</html>
簡單的PHP頁面：在你的代碼
<?php
aOm();
function aOm(){
header("Content-type: text/plain; charset=utf-8");
echo "added";
}
?>
描述什麼是實際發生（錯誤等），你會發生什麼，而不是「它不工作」 –
@PhillSparks謝謝你的建設性的建議，我已經添加這些部分更清晰的形式 – CodyBugstein