Keep the countdown in Forms

Question

Keep the countdown in Forms

Navigation

#1 by (1 votes)
#2 by (0 votes)
#3 by (0 votes)

1

I have the following code, which puts a chronometer in countdown and sends the form the data you have to the BD but the problem is that the users to update the web page, the timer returns after 2 minutes. There is some way for the relog to keep time. I have the login made in PHP and mysql where access to this site is for the charge is equal to or less than 3 then access the page and if not then it does not show the page.

<?php 
  include("../sesion.class.php");
$sesion=new sesion();
$cargo=$sesion->get("cargo");
$usuario=$sesion->get("usuario");
if ($cargo=='3') { ?>
// se escribe el contenido de la pagina web


//fin del sitio web
<?php  }else{
  echo "No eres Administrador y No tienes Permiso para ver esta pagina ";
  echo "<a href ='../index.php' > REGRESAR </a>";
}?>


<script>

var salida = document.getElementById("tiempo"),
    minutos = 2,
    segundos = 0,
    intervalo = setInterval(function(){
        if (--segundos < 0){
            segundos = 59;
            minutos--;
        }

        salida.innerHTML = minutos + ":" + (segundos < 10 ? "0" + segundos : segundos);

        if (!minutos && !segundos){
            clearInterval(intervalo);
            document.getElementById("test").submit();
        }
    }, 1000);
</script>

this is the form

<form action="accion.php" method="post" id="test">
<label id = "tiempo">02:00 </label><br>
<input type='text' name='name' >

<button type="submit" name="test" id="test" class="btn-u btn-block rounded">Siguiente >>>> </button>
</form>

javascript html5 php

asked by Milton W. Orellana 26.06.2017 в 20:05

source

3 answers

Delete a row from a single table by doing INNER JOIN from several tables Perform instruction in vb according to the weight that is contained in a folder

score 1 · Answer 1

You can do it with cookies, I illustrate with an example:

var timeOut = parseInt(Cookies("Read", "AutoSubmit")),
 maxTime = 2 * 60 * 1000; // Tiempo de Espera (En Minutos)

if ( !timeOut ) {
 date = new Date();
 timeOut = date.getTime() + maxTime;
 Cookies("Write", "AutoSubmit", timeOut);
}
date = new Date();
timeOut = (parseInt(timeOut) - date.getTime());

if (timeOut > 0) {
 messg = "Envio del Formulario (en "+ (timeOut) +"ms)";
 setTimeout(function (){
  document.forms[0].submit();
 }, timeOut);
} else {
 messg = "Envio del Formulario ...En Proceso.";
 Cookies("Remove", "AutoSubmit");
 document.forms[0].submit();
}
document.getElementById("messg").innerHTML=messg;

// Rutina para manejar Cookies (puedes usar la que gustes)
function Cookies(action, name, value, days, expires) {
  switch (action) {
    case "Read":
      var myCookies = "; "+document.cookie+"; ",
          myCookie  = "",
          Index     = myCookies.indexOf("; "+name+"=")+name.length+3;

      if (Index >= name.length+3)
        myCookie = myCookies.substring(Index,myCookies.indexOf("; ",Index));

      return unescape(myCookie);

    case "Write":
      var myCookie = name+"="+escape(value);
      if (days && !expires) {
        var expires = new Date();
        expires.setTime(expires.getTime() + (1000 * 60 * 60 * 24 * days));
      }
      if (expires)
        myCookie += "; expires="+expires.toGMTString();

      document.cookie = myCookie+";"; 
      return unescape(myCookie);

    case "Remove":
      var myCookie = name+"=; expires=0";
      document.cookie = myCookie+";";
      return unescape(myCookie);

    default:
      var massage = null;
      massage +="use: Cookies(action, name[, value[, days[, expires]]])\n";
      massage +="     where: action is 'Read', 'Write', 'Remove'\n";
      massage +="            name is Name of Cookies\n";
      massage +="            value is data to Write\n";
      massage +="            days is number of days to expires a Cookies.\n";
      massage +="          & expires is date to expires a Cookies.\n";
      alert(massage);
  }
}

<h1>Contactos</h1>
<pre>
 <form name="contacto">
    nombre <input name="name">
  telefono <input name="phone">
  <hr>
 <input type="submit">
 </form>
</pre>
<div id="messg">
</div>

Here is the functional example in jsfiddle.net (no error)

score 0 · Answer 2

Using only javascript I do not see it feasible, you would have to rely on a database and a php language to do it, in addition to a login screen

the idea would be that when you enter the page register an id corresponding to the user using session variables with this id you can register in the database the date on which I enter the page, with the date recorded each time you reload page you verify by comparing the current time with your record how much time you have left before the counter time runs out

score 0 · Answer 3

Thanks for the clarification, I tried to adapt it to the page but the problem is as follows: - they are a total of 5 pages of an online evaluation that I am creating: eva1.php (proceso_eva1.php) eva2.php (proceso_eva2.php), etc. - It would have to work in the following way: that the user at the start of the test the timer would not have to restart when the page refreshes (update the page) but ADAPTING the code does that process but saves all the pages of one, until the end What would the problem be?