Ничего не произошло на странице, пока ajax передавал параметр в php? - PullRequest
Новая
       17

Ничего не произошло на странице, пока ajax передавал параметр в php?

0 голосов
/ 28 мая 2019

Я попытался сделать таймер на HTML, используя JavaScript, код выглядит так: 

<script>
var duration = document.getElementById('duration'),
    start = document.getElementById('start'),
    timestart = document.getElementById('timestart'),
    timestop = document.getElementById('timestop'),
    stateupdate = document.getElementById('stateupdate'),
    seconds = 0, minutes = 0, hours = 0,
    state = 0,
    startedDate,
    durationTime,
    stoppedDate,
    t;

var idGate = 8;

function add() {
    seconds++;
    if (seconds >= 60) {
        seconds = 0;
        minutes++;
        if (minutes >= 60) {
            minutes = 0;
            hours++;
        }
    }
    
    start.textContent = (hours ? (hours > 9 ? hours : "0" + hours) : "00") + ":" + (minutes ? (minutes > 9 ? minutes : "0" + minutes) : "00") + ":" + (seconds > 9 ? seconds : "0" + seconds);

    timer();
}
function timer() {
        t = setTimeout(add, 1000);
}

/* Start button */
start.onclick = function(){
    if(state==0){
        state=1;
        timer();
        var today = new Date();
        var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
        var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
        startedDate = date+' '+time;
        timestart.innerHTML = startedDate;
    }else if(state==1){
        state=2;
        durationTime = start.textContent;
        clearTimeout(t);
        start.textContent = "stopped";
        duration.innerHTML = durationTime;
        var today = new Date();
        var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
        var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
        stoppedDate = date+' '+time;
        timestop.innerHTML = stoppedDate;
        
        stateupdate.textContent = idGate;
        //get the input value
	    $.ajax({
            //the url to send the data to
            url: "updatestatus.php",
            //the data to send to
            data: {idGate : $idGate, startedDate : $startedDate, durationTime : $durationTime ,stoppedDate : $stoppedDate},
            //type. for eg: GET, POST
            type: "POST",
            //on success
            success: function(data){
                alert("sukses!");
                alert(data);
            },
            //on error
            error: function(){
                alert("Gagal");
                alert(data);
            }
        });
    }
}
</script>
.btn{
    display: inline-block;
    text-decoration: none;
    background: #87befd;
    color: #FFF;
    width: 180px;
    height: 180px;
    line-height:180px;
    border-radius: 50%;
    vertical-align: middle;
    overflow: hidden;
    box-shadow: 0px 0px 0px 5px #87befd;
    border: dashed 1px #FFF;
    transition: .4s;
    position: inherit;
    top: 40%;
    font-size: 40px;
}

.btn:hover{
    background: #668ad8;
     box-shadow: 0px 0px 0px 5px #668ad8;
}



.wrapper {
    margin: 20px;
    text-align: center;
}

.wrapper1 {
    width:40%;
    float:left;
    text-align: right;
    display: inline;
}
.wrapper2 {
    float: right;
    text-align: center;
    width:20%;
    display:inline;
}
.wrapper3 {
    float:right;
    width:40%;
    display:inline;
}
<head> <link rel="stylesheet" href="style.css"></head>
<div class="wrapper">
    <button id="start" class="btn">start</button>
</div>
<div class ="wrapper1">
    <h3>Time started : </h3><h2 id="timestart"> 00:00:00</h2>
</div>
<div class ="wrapper3">
    <h3>Time stopped : </h3><h2 id="timestop"> 00:00:00</h2>
</div>
<div class ="wrapper2">
    <h3>Durations : </h3><h2 id="duration"> 00:00:00</h2>
</div>   
<div class ="wrapper2">
        <h3>State : </h3><h2 id="stateupdate"> 00:00:00</h2>
</div>

Итак, таймер работает нормально, но я попытался передать эту 4 переменную: $ idGate, $ startDate, $ durationTime, $ stopDate. Я попробовал этот метод ajax, чтобы передать переменную в php и обновить базу данных на другой странице, которая имеет такой же случай, как этот, он отлично работает. Но когда я попробовал в этом таймере HTML я не понимаю, почему этот метод не работает. На самом деле в фоновом режиме этот метод ajax работает, php получает эти 4 переменные, которые были переданы из метода ajax, но когда я проверяю базу данных, данные вообще обнуляются. я не знаю, что не так с этим кодом, я пытался сделать переменную равной static, чтобы проверить, не работает ли код или передана ли переменная null. Но это тоже не работает, также на таймере ничего не произошло страница, предупреждение не отображается, ничего не произошло. Что я пропустил из этого кода?

это мой updatestatus.php: 

if(isset($_POST['idGate'])){
include 'config.php';

$id           = $_POST['idGate'];
$startedDate  = $_POST['startedDate'];
$durationTime = $_POST['durationTime'];
$stoppedDate  = $_POST['stoppedDate'];

$queryselect = mysqli_query($con, "select * from dataperijinan where id='$id'");
$row = mysqli_fetch_array($queryselect);
if(!empty($row)){
    $nik            = $row['nik'];
    $namateknisi    = $row['namateknisi'];
    $nohp           = $row['nohp'];
    $jenispekerjaan = $row['jenispekerjaan'];
    $noktp          = $row['noktp'];
    $rangewaktu     = $row['rangewaktu'];
    $filelocationdb = $row['filelocation'];
    $status         = $row['status'];
    $tujuan         = $row['tujuan'];
    $sto            = $row['sto'];
}

$query = mysqli_query($con, "insert into histori values(0,'$namateknisi','$nik','$nohp','$noktp','$rangewaktu','$jenispekerjaan','$filelocationdb','$startedDate','$durationTime','$sto','$stoppedDate')");

if($query){
    $querydelete = mysqli_query($con, "delete from dataperijinan where id='$id'");
}

}

...