[英]Ajax request with vanilla JS is returing 200OK
我已經搜索了很多,但是我只能找到jQuery和JSON的答案。 但是目前,我正在使用香草JS客戶端和PHP服務器端,並希望暫時保留該功能(我是新手)。
我有一個帶復選框的模式,供用戶設置或更改他的標准工作日。 更改將保存在數據庫中。 當用戶打開模態時,我希望選中/不選中復選框以反映其當前的工作模式。
我的代碼有效(從數據庫檢索數據並且選中或未正確選中框)。 但是,我從Ajax呼叫中收到一條錯誤消息。 200OK。 我不明白為什么,但我想解決我正在犯的明顯錯誤(而不是隱藏錯誤)。 請查看我的代碼:
模態:
<div id="vastRooster" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<p id="vrMsg" ></p>
<h2 class="text-center"><img src="//placehold.it/110" class="img-circle"><br>Vast rooster</h2>
</div>
<div class="modal-body">
<h6 class="text-center">Stel uw vaste werkdagen in of wijzig deze. Wijzigingen worden per direct verwerkt in het rooster.</h6><br>
<form onsubmit="vastleggenRooster()" role="form" id="form" name="vRooster" method="post">
<div class="form-group">
<input type="checkbox" id="0" name="MaMo">Maandagmorgen
</div>
<div class="form-group">
<input type="checkbox" id="1" name="DiMo">Dinsdagmorgen
</div>
<div class="form-group">
<input type="checkbox" id="2" name="DiMi">Dinsdagmiddag
</div>
<div class="form-group">
<input type="checkbox" id="3" name="WoMo">Woensdagmorgen
</div>
<div class="form-group">
<input type="checkbox" id="4" name="DoMo">Donderdagmorgen
</div>
<div class="form-group">
<input type="checkbox" id="5" name="VrMo">Vrijdagmorgen
</div>
<div class="form-group">
<button type="submit" class="btn btn-danger btn-lg btn-block">Wijzigingen opslaan</button>
</div>
</form>
</div>
</div>
</div>
JavaScript(在主體checkVR()
調用功能checkVR()
):
function checkVR() {
var qString = 1;
callAjax(qString, 'core/functions/checkVastRooster.php', verwerkCheckVR, 'vrMsg');
}
function callAjax(queryString, url, callback, message){
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if(request.readyState === 4 && request.status === 200) {
callback(request.responseText, message);
} else {
document.getElementById(message).innerHTML = 'Er is een fout opgetreden: ' + request.status + ' ' + request.statusText;
}
}
request.open("POST", url, true);
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(queryString);
}
function verwerkCheckVR(result) {
for (i = 0; i < 6; i++) {
if (result[i] == 1) {
document.getElementById(i).checked = true;
} else {
document.getElementById(i).checked = false;
}
}
}
PHP:
<?php
require '../init.php';
if(empty($_POST) === false) {
if (!$selvr->bind_param("i", $session_gebruiker_id)) {
echo "Binding parameters failed: (" . $selvr->errno . ") " . $selvr->error;
}
if (!$selvr->execute()) {
echo "Execute failed: (" . $selvr->errno . ") " . $selvr->error;
}
if (!$selvr->bind_result($MaMo, $DiMo, $DiMi, $WoMo, $DoMo, $VrMo));
while ($selvr->fetch()) {
echo $MaMo, $DiMo, $DiMi, $WoMo, $DoMo, $VrMo;
}
}
?>
我希望有人可以幫助我弄清楚我的Ajax調用出了什么問題。 就像我說我正在學習一樣,關於我的代碼的任何其他評論也非常受歡迎。
感謝您的寶貴時間,我希望有一天能過得很好,好好向前發展。
您在這里缺少的是標頭和http_response_code。
為了接收有效的Ajax響應,您的PHP文檔應該類似於以下內容:
<?php
header("Content-Type: application/json;charset=utf-8");
require '../init.php';
if (empty($_POST) !== false) {
http_response_code(200);
}
if (!$selvr->bind_param("i", $session_gebruiker_id)) {
http_response_code(400);
echo "Binding parameters failed: (" . $selvr->errno . ") " . $selvr->error;
}
if (!$selvr->execute()) {
http_response_code(400);
echo "Execute failed: (" . $selvr->errno . ") " . $selvr->error;
}
// This IF is not doing anything!
// if (!$selvr->bind_result($MaMo, $DiMo, $DiMi, $WoMo, $DoMo, $VrMo));
while ($selvr->fetch()) {
http_response_code(400);
echo $MaMo, $DiMo, $DiMi, $WoMo, $DoMo, $VrMo;
}
?>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.