En javascript existen varias librerías que te ayudarían a realizar lo que estas buscando, sin embargo, he creado un script para poder explicarte que es lo que se debe hacer para sumarle la cantidad de días deseados.
- Primero debes agregar una función que detecte cuando el valor del primer campo cambie
$fecha1.change(function() {} );
- Dentro de la función change debemos convertir el valor de la fecha1 dt1 de tipo String a tipo Date. https://www.w3schools.com/jsref/jsref_obj_date.asp
new Date(year, month, day, hours, minutes, seconds, milliseconds);
- Luego que tenemos la fecha1 dt1 en tipo Date, procedemos a agregarle los días requeridos y utilizar el valor para crear una nueva fecha.
- Obtenida la fecha2 dt2, obtenemos el año, mes y día con las funciones
getFullYear(), getMonth(), getDate()
- Tomar en consideración que el mes cuenta de 0 a 11, por lo que deberás sumarle uno para obtener el mes que deseas.
$(document).ready(function() {
var $fecha1 = $('#FechaI')
,$fecha2 = $('#FechaF')
,dias = 30;
$fecha1.change(function() {
var pattern = /(\d{4})-(\d{2})\-(\d{2})/
,dt1 = new Date(this.value.replace(pattern,'$1,$2,$3'))
,dt2 = new Date(dt1.setDate(dt1.getDate() + dias));
console.log(this.value.replace(pattern,'$1-$2-$3'));
$fecha2.val(dt2.getFullYear() + '-' + (dt2.getMonth() + 1) + '-' + dt2.getDate() );
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="Date" id="FechaI" class="form-control" name="FechaI"/>
<input type="Date" id="FechaF" class="form-control" name="FechaF" />