0

Buenas tengo un formulario que es para agregar un periodo lectivo. Los campos son id_pl, descripcion_pl, inicio_pl, finalizacion_pl Lo que necesito es que cuando selecciono la fecha de inicio automáticamente a esa fecha se le sumen 40 semanas y que esa fecha sea finalizacion_pl y aparezca automáticamente, eh visto en otras publicación pero solo le hacen con la fecha actual De antemano gracias, adjunto el formulario

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    <section id="container">         
        <div class="form_register">
            <div class="titulo">
            <form action="" method="post">
            <label for="Descripcion"><i class="fa fa-edit"></i>          Descripcion:</label>
            <input type="text" name="descripcion_pl" id="Descripcion" placeholder="Descripcion de periodo lectivo" required>
            <label for="Inicio de periodo lectivo"><i class="fa fa-calendar"></i> Inicio de periodo lectivo:</label>
            <input type="date" name="inicio_pl" id="Inicio de periodo lectivo" placeholder="Inicio de periodo lectivo" required>
            <label for="Finalizacion de periodo lectivo:"><i class="fa fa-calendar"></i> Finalizacion de periodo lectivo:</label>
            <input type="date" name="finalizacion_pl" id="Finalizacion de periodo lectivo:" placeholder="Finalizacion de periodo lectivo" required>
            <input type="submit" value="&#128190; Guardar"  class="btn_save">
            </form>

            <br>
        </div>


    </section>
</body>
</html>

1 respuesta 1

0

EL concepto a aplicar va muy de la mano del que dices que ya revisaste de la fecha actual.

Quedaria algo asi:

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
    <section id="container">         
        <div class="form_register">
            <div class="titulo">
            <form action="" method="post">
            <label for="Descripcion"><i class="fa fa-edit"></i>          Descripcion:</label>
            <input type="text" name="descripcion_pl" id="Descripcion" placeholder="Descripcion de periodo lectivo" required>
            <label for="Inicio de periodo lectivo"><i class="fa fa-calendar"></i> Inicio de periodo lectivo:</label>
            <input type="date" name="inicio_pl" id="Inicio de periodo lectivo" placeholder="Inicio de periodo lectivo" required onchange="calcularFechaFin(this.value)">
            <label for="Finalizacion de periodo lectivo:"><i class="fa fa-calendar"></i> Finalizacion de periodo lectivo:</label>
            <input type="date" name="finalizacion_pl" id="Finalizacion de periodo lectivo:" placeholder="Finalizacion de periodo lectivo" required>
            <input type="submit" value="&#128190; Guardar"  class="btn_save">
            </form>

            <br>
        </div>


    </section>
</body>

<script>
    function calcularFechaFin(fecha) {
        var semanas = 40
        fecha = new Date(fecha)
        fecha.setDate(fecha.getDate() + (semanas * 7));
        document.getElementsByName('finalizacion_pl')[0].valueAsDate  = fecha
    }
</script>
</html>

Entendiendo que se hace calculo plano de 40 semanas se añade a la fecha 7 * 40 que serian los dias que corresponden a dicho periodo y se añade el resultado al campo finalizacion_pl. Finalmente, si el campo finalizacion_pl se va a llenar solo, quiza deberias ponerlo como disabled asi no se permite al usuario llenarlo.

1
  • 1
    Muchísimas gracias si me funciono :) Commented el 23 dic. 2021 a las 13:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.