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 original
const 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)