Tengo dos campos de fecha,
<div class="form-group">
<div class="input-group date" id="datetimepicker1">
<input id="fechInicio" name="fechInicio" class="form-control" type="text"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
<div class="form-group">
<div class="input-group date" id="datetimepicker2">
<input id="fechFin" name="fechFin" class="form-control" type="text"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
Al cargar la pagina El campo fechInicio
muestra por default la fecha de 3 meses atrás de la fecha que esta seleccionada en el campo fechFin
, por default el campo fechFin
muestra la fecha actual, por ejemplo hoy 02/08/2018, entonces el campo fechInicio
muestra 02/05/2018, y si muevo el campo fechFin
, se actualiza el campo fechInicio
,
Otra de las funciones que hace es que para el campo fechFin
no permite seleccionar una fecha mayor a la fecha actual, y el campo fechInicio
, no permite seleccionar una fecha anterior a los 3 meses de la fecha fin, y tampoco permite seleccionar una fecha mayor a la fecha seleccionada en fechFin
.
Hace las validaciones que menciono bien, pero las hace cuando primero doy click en el "datetimepicker2"
, que es el campo fechFin
, si yo aquí primero selecciono una fecha, actualiza la otra y aplica las validaciones, pero cuando yo entro a la pagina y quiero seleccionar una fecha del "datetimepicker1"
, es decir la fecha inicio me deja seleccionar mas dias de la fecha de los 3 meses y después en el otro campo, NO respeta las validaciones, porque me permite seleccionar una fecha mayor al del día actual en el campo fechFiny no es correcto, solo lo hace cuando primero doy click en el
"datetimepicker2"`
Esta es mi función, como puedo hacer para que aplique las validaciones al yo seleccionar primero cualquiera de los campos?
function validaFechas(){
$('datetimepicker1').datetimepicker({
locale: 'es',
format: 'L',
useCurrent: false,
defaultDate: new Date()
});
$('datetimepicker2').datetimepicker({
locale: 'es',
format: 'L',
useCurrent: false,
defaultDate: new Date()
});
$("#datetimepicker1").on("dp.change",function (e){
var fechaInicio = new Date(e.date);
$('#datetimepicker2').data("DateTimePicker").minDate(e.date);
var maximaFechaFin = new Date();
maximaFechaFin.setMinutes(1);
$('#datetimepicker2').data("DateTimePicker").maxDate(maximaFechaFin);
});
$("#datetimepicker2").on("dp.change",function (e)
{
$('#datetimepicker1').data("DateTimePicker").maxDate(e.date);
var maximaFechaInicio = new Date();
var minimoFechaInicio = new Date(maximaFechaInicio.getFullYear(), maximaFechaInicio.getMonth(), maximaFechaInicio.getDate() -92);
$('#datetimepicker1').data("DateTimePicker").minDate(minimoFechaInicio);
});
}