how to apply validations in datetimepicker?

Question

how to apply validations in datetimepicker?

Navigation

#1 by (0 votes)

0

I have two date fields,

<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>

When loading the page The field fechInicio shows by default the date 3 months ago of the date that is selected in the field fechFin , by default the field fechFin shows the current date, for example today 02 / 08/2018, then the field fechInicio shows 02/05/2018, and if I move the field fechFin , the field fechInicio is updated,

Another function it does is that for the field fechFin does not allow selecting a date greater than the current date, and the field fechInicio , does not allow selecting a date before 3 months from the end date, and it also does not allow selecting a date greater than the selected date in fechFin .

Do the validations that I mention well, but do them when I first click on the "datetimepicker2" , which is the field fechFin , if I here first select a date, update the other and apply the validations, but when I I enter the page and I want to select a date of "datetimepicker1" , that is, the start date allows me to select more days from the date of the 3 months and then in the other field, it does NOT respect the validations, because it allows me to select a higher date to the current day in the field fechFin y no es correcto, solo lo hace cuando primero doy click en el "datetimepicker2" '

This is my function, how can I apply for the validations when I first select any of the fields?

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);
     });
      
    }

java javascript jquery bootstrap

asked by Root93 02.08.2018 в 22:07

source

1 answer

I need you to display the text string on the screen are permutations without repetition Transactions per second in oracle?

score 0 · Answer 1

If you can not initialize the constructor, as Carmen said, you could use a kind of wrap, and call it from window.onload , so you associate them from the beginning.

  function SetRuleDp2(p1, p2) {
   //Control dp2
    var date1 = $("#datetimepicker1").datepicker('getDate');   
    var maximaFechaFin = new Date();
    maximaFechaFin.setMinutes(1);

    $('#datetimepicker2').data("DateTimePicker").maxDate(maximaFechaFin);    
    $('#datetimepicker2').data("DateTimePicker").minDate(date1);
 } 
 function SetRuleDp1(p1, p2) {
   //Control dp1
     var date2 = $("#datetimepicker2").datepicker('getDate');
     var day2  = date1.getDate(); 
     var month2 = date.getMonth() + 1;              
     var year2 =  date.getFullYear();
     var maxFechaInicio = new Date(year2, month2, day2 - 92);
     $('#datetimepicker1').data("DateTimePicker").maxDate(date2);
     $('#datetimepicker1').data("DateTimePicker").minDate(maxFechaInicio);
 }   
window.onload = function() {
     SetRuleDp1(); 
     SetRuleDp2(); 
 }  
 $("#datetimepicker2").on("dp.change",function (e){
     SetRuleDp1();      
 });
  $("#datetimepicker1").on("dp.change",function (e){
     SetRuleDp2();      
 });