PHP + Javascript countdown

0

I have a column in the database named time , it has an event that does the following:

UPDATE users SET time = time - 1

As default you get 1800 seconds (30 minutes) right?

Now I wanted to recover the decaying time I tried the following:

<?php
$database = new DB;

/*Selectiono meu usuário*/
$select = $database->select($username);

/*Aqui retorno tudo*/
$fetch = $select->fetch(PDO::FETCH_ASSOC);

/*Aqui imprimo na tela o conteúdo do campo time*/
echo $fetch['time'];
?>

Now I tried to do the following to recover, but it does not appear. That is, it does not work.

$(document).ready(function() {
    $('.contagem').css('display', 'block');
    $('.contagem').html("<?php echo $fetch['time']?>");
});

From the error on the first line:

$(document).ready(function() {

I revamped this site and nothing helped me.

Edit

Code all

<?php
$database = new DB;

/*Selectiono meu usuário*/
$select = $database->select($username);

/*Aqui retorno tudo*/
$fetch = $select->fetch(PDO::FETCH_ASSOC);

/*Aqui imprimo na tela o conteúdo do campo time*/
echo $fetch['time'];
?>
<!DOCTYPE html>
<html>
<head>
    <title>
        Contagem
    </title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script></head><body><spanclass="contagem" style="display: none;"></span>

<script type="text/javascript">
        $(document).ready(function() {
        $('.contagem').css('display', 'block');
        $('.contagem').html("<?php echo $fetch['time']?>");
    });
</script>
</body>
</html>

Note: When you reach 0 reload the page.

    
asked by anonymous 02.08.2017 / 13:53

3 answers

1

I got this code in the answer in the English OS. Since it is not possible to interpret php in the snippet below, I put the fixed value of 180 seconds (3 minutes).

/* Código exposto em uma página php */
//var contador = '<?php echo $fetch['time']?>'; /**** Variável do PHP ****/
var contador = '180';

/* A partir daqui, pode ficar em um arquivo .js */
function startTimer(duration, display) {
  var timer = duration, minutes, seconds;
  setInterval(function() {
    minutes = parseInt(timer / 60, 10)
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + ":" + seconds;

    if (--timer < 0) {
      location.reload();
    }
  }, 1000);
}

window.onload = function() {
  var count = parseInt(contador),
    display = document.querySelector('#time');
  startTimer(count, display);
};
<div>Registros terminam em <span id="time">Carregando...</span>!</div>
    
02.08.2017 / 14:22
1

The error of the first line is because you put the read ..

$(document).ready(function() {
}

I imagine you're in the same php file, when you throw that <?php into the $ ('count'), correct?

To validate the time, create a setInterval, and when it reaches 0, you trigger the reload of the page.

    segundos = <?php echo $fetch['time']?>;
    setInterval(function(){
        if(segundos > 0)
          segundos = segundos - 1;
        else
          location.reload();

        $('.contagem').html(segundos);

    }, 1000/*a cada segundo, esta func vai rodar*/);
    
02.08.2017 / 14:15
0

I made this change to show the second time in the act and redirect to a specific page.

<h1>Nada foi encontrado no servidor</h1>
<div id="msg"></div>
<script type="text/javascript">	
	var tempo = 100;	
  setInterval(function(){
		 if(tempo >0){
		 	 tempo = tempo-1;
		 	document.getElementById('msg').innerHTML = "Voce será redirecionado em "+tempo+" segundos";
		 	if(tempo==0){		
			window.location.href = 'login';				
	}
		 }
		},tempo);
	
</script>
      var time = 100;   setInterval (function () {          if (time > 0) {              time = time-1;             document.getElementById ('msg'). innerHTML="You will be redirected in" + time + "seconds";             if (time == 0) {             window.location.href = 'login';     }          }         },time);     
28.02.2018 / 16:06