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

0

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

I want to validate that the time is between 09:00 and 12:00 hrs for the start time and from 13:00 - 18:00 hrs for the end time, the problem is that I need to validate with format HH: MM : SS 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>

I hope you can collaborate.

-Thanks.

    
asked by Ricardo Sauceda 03.10.2017 в 23:27
source

1 answer

1

You only need to use the methods:

getHours()
getMinutes()
getSeconds()

Each one will give you the hours, minutes and seconds independently and then you can concatenate it to a chain like here:

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!');
    
answered by 03.10.2017 / 23:47
source