Home / Questions / 106978
Accepted
Ricardo Sauceda
Asked: 2020-10-04 13:27:06 +0800 CST 2020-10-04 13:27:06 +0800 CST

How to validate the hours in HH:MM:SS format through an INPUT TEXT with JAVASCRIPT?

  • 772

I have 3 fields, day, start time and end time.

I want to validate that the time is between 09:00 and 12:00 for the start time and 13:00 - 18:00 for the end time, the problem is that I need to validate with HH:MM:SS format and is an INPUT text.

<div>
   <select class="dia sel tf w-select" data-name="Selecciona Una Opcion 2" id="txtTipoPropiedad" name="txtTipoPropiedad">
       <option value="0" selected>Día</option>
       <% for (int i = 0; i < dia.length; i++) {                                                    
            out.println("<option value=\"1\">" + dia[i] + "</option>");
          }
       %>
   </select>
   <input class="porc right tf w-input" id="node_i" maxlength="256" name="h_ini" placeholder="09:00 - 12:00 hrs" required="required" type="text">
   <input class="porc right tf w-input" id="node_f" maxlength="256" name="h_fin" placeholder="13 - 18:00 hrs" required="required" type="text">
</div>
javascript

1 Answers

  1. Best Answer

    You just need to use the methods:

    getHours()
getMinutes()
getSeconds()

    Each will give you the hours, minutes and seconds independently and you can then concatenate them to a string like this:

    window.addEventListener('DOMContentLoaded',m);

function m(){
var fecha = new Date();
var horas = fecha.getHours();
var minutos = chequearNumero(fecha.getMinutes());
var segundos = chequearNumero(fecha.getSeconds());
var divHora = document.getElementById('hora');
 divHora.innerHTML = horas + ": " + minutos + ": " + segundos;
}
function chequearNumero(numero){
  if(numero < 10) numero = "0" + numero;
  return numero;
}
 setInterval(m,500);
    <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <i id="hora"></i>
</body>
</html>

    Then later, you can limit it to the time, in case you need more specific tasks, for example:

    var time = new Date();
if(time.getHours() > 18) alert('Te pasaste de las 18(6 de la tarde)');
else alert('Aún no son las siete, date prisa!');

    • 2