与vanilla JS的Ajax请求正在退回200OK

I have searched for this a lot, but all I can find is answers for jQuery and JSON. But at this time I am using vanilla JS clientside and PHP serverside and would like to keep it at that for now (I'm a novice).

我已经搜索了很多,但我能找到的只是jQuery和JSON的答案。但此时我正在使用vanilla JS客户端和PHP服务器端,并希望暂时保留它(我是新手)。

I have a modal with checkboxes for a user to set or change his standard workdays. Changes are saved in the database. When a user opens the modal, I want the checkboxes to be checked/not checked to reflect their current work pattern.

我有一个带有复选框的模态,供用户设置或更改其标准工作日。更改将保存在数据库中。当用户打开模态时,我希望选中/不选中复选框以反映其当前的工作模式。

My code works (the data is retreived from the database and the boxes are checked or not checked correctly). However, I am getting an error message from my Ajax call; 200OK. I don't understand why and I would like to solve the apparent mistake I'm making (rather than hide the error). Please see my code:

我的代码有效(数据从数据库中检索出来,并且选中或未正确检查框)。但是,我收到来自Ajax调用的错误消息; 200 OK。我不明白为什么,我想解决我正在犯的明显错误(而不是隐藏错误)。请看我的代码:

Modal:

<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 (function checkVR() is invoked on body onload):

JavaScript(在body onload上调用函数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;
}

}

?>

I hope someone can help me figure out what's wrong with my Ajax call. Any other remarks about my code are very welcome too, like I said I am learning.

我希望有人可以帮我弄清楚我的Ajax调用有什么问题。关于我的代码的任何其他评论也非常受欢迎,就像我说我正在学习。

Thanks for your valuable time, I hope one day to be good enough to pay it forward.

感谢您宝贵的时间,我希望有一天能够很好地支付它的费用。

1 个解决方案

#1

What you're missing here is the header and the http_response_code.

你在这里缺少的是标题和http_response_code。

In order to receive a valid Ajax response, your PHP document should be something similar to this:

为了接收有效的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;
}
?>

1 个解决方案

#1

更多相关文章

随机推荐