1

Una manera simple para cuando seleccione una fecha en mi calendario Fecha, automaticamente se selecione 15 dias mas en mi calendario Vigencia como default ya sea con JavaScript o JQuery?. El atributo tipo "d" es para validar.

<div class="form-group wrap-input100 rs1-wrap-input100" style="margin-left: 10px;">
    <span class="label-input100">Fecha</span>
    <input type="date" class="input100" id="txtFecha" tipo="d" placeholder="Fecha" required >
    <span class="focus-input100"></span>
</div>
<div class="form-group wrap-input100 rs1-wrap-input100" style="margin-right: 10px;">
    <span class="label-input100">Vigencia</span>
    <input type="date" class="input100" id="txtVigencia" tipo="d" placeholder="Vigencia" required>
    <span class="focus-input100"></span>
</div>

1 respuesta 1

3

Te deje ejemplo con JQuery que yo he utilizado:

//obtener fecha
$('#txtFecha')[0].valueAsDate = new Date();
//agregar metodo onchange
$('#txtFecha').change(function() {
  //obtener fecha del elemento txtFecha
  var fecha = this.valueAsDate;
  //sumar 15 días a la fecha
  fecha.setDate(fecha.getDate() + 15);
  //asignar la nueva fecha al elemento txtVigencia
  $('#txtVigencia')[0].valueAsDate = fecha;
});
$('#txtFecha').change();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<div class="form-group wrap-input100 rs1-wrap-input100" style="margin-left: 10px;">
	<span class="label-input100">Fecha</span>
	<input type="date" class="input100" id="txtFecha" tipo="d"  placeholder="Fecha" required >
	<span class="focus-input100"></span>
</div>
<div class="form-group wrap-input100 rs1-wrap-input100" style="margin-right: 10px;">
	<span class="label-input100">Vigencia</span>
	<input type="date" class="input100" id="txtVigencia" tipo="d" placeholder="Vigencia"  required>
	<span class="focus-input100"></span>
</div>

Saludos!

1
  • Buena respuesta. No se si viene al caso, pero tal como lo tienes, el usuario puede cambiar el valor de txtVigencia. Para evitarlo usaría el atributo disabled en vez de required.
    – DjCrazy
    el 18 may. 2019 a las 12:53

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.