tengo un select que le saco su valor directamente desde la base de datos que me muestras las horas registradas y aparte tengo dos timepicker hora de entrada y hora de salida ahora lo que quiero es esto: si en el select escojes 3 horas, el input hora de entrada se escoje las hora actual que marca el pc, pero en el input hora de salida debe marcar las horas de diferencias, ejemplo si son las 9 pm que es la hora actual entonces en el input hora de salida debe marcar 12 am porque hay tres horas de diferencias que es las que se ecojieron en el select, otro ejemplo
escojo: 9 horas
la hora de entrada es: hora de entrada: 1 pm
debería marcarse automáticamente la hora de salida a: hora de salida: 9 pm
mi select e input
Código PHP:
Ver original<div class="input-field col s12 m4">
<select name="horas" id="horas" onchange="calcula_porcentaje(this.value)">
<option value="" disabled selected>Cantidad Horas:</option>
<?php
$consulta = $DB_con->query("SELECT * FROM horas ORDER BY id_horas");
while ($linea = $consulta->fetch(PDO::FETCH_ASSOC)) {
?>
<option value="<?php echo $linea['horas'] ;?>"><?php echo $linea['horas'] ;?> Horas</option>
<?php
}
?>
</select>
</div>
<div class="input-field col s12 m4">
<input type="text" id="hora_entrada" class="timepicker" name="hora_entrada"/>
<label for="cuentas" class="black-text ">Hora de Entrada:</label>
</div>
<div class="input-field col s12 m4">
<input type="text" id="hora_salida" class="timepicker" name="hora_salida"/>
<label for="cuentas" class="black-text ">Hora de Salida:</label>
</div>
mi funcion
Código Javascript
:
Ver originalconst hora_entrada = document.getElementById('hora_entrada')
const hora_salida = document.getElementById('hora_salida')
const horas = document.getElementById('horas')
const actualizarSalida = () => {
const date = new Date(hora_entrada.value)
const horasSeleccionadas = parseInt(horas.options[horas.selectedIndex].value)
date.setHours(date.getHours() + horasSeleccionadas)
hora_salida.value = formatDate(date) /
}
hora_entrada.addEventListener("change", actualizarSalida)
horas.addEventListener("change", actualizarSalida)
const formatDate = date => `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getUTCDate())}`+
`T${pad(date.getHours())}:${pad(date.getMinutes())}`
const pad = val => ('0' + val).slice(-2)