CODEWITHSUNDEEP
javascriptjquerydatepicker
vellai durai
vellai durai

Reputation: 1011

Set mindate in bootstrap datepicker

I have 2 date picker on change of 1st date picker i need to set selected date as mindate value of the 2nd date picker . Here is my coe for that 

<input type="text" size="30" class="date_picker_from form-control valid" id="start" value="" name="start" aria-invalid="false">

<input type="text" size="30" class="date_picker_to form-control valid" id="end" value="" name="end" aria-invalid="false">


$('.date_picker_from').datepicker({
    setDate: new Date(),
     format: 'dd/mm/yyyy',
    todayHighlight: true,
  autoclose:true,
  startDate: '-0m',
  minDate:0,

});

$('.date_picker_to').datepicker({
    //setDate: new Date(),
    format: 'dd/mm/yyyy',
    todayHighlight: true,
  autoclose:true,
  startDate: '+1d',
  minDate:0,

});

$("#start").change( function() {


var secondDate = new Date($("#start").datepicker( "getDate" ));

var date2 = new Date(secondDate.getTime());


date2.setDate(date2.getDate() + 1);
   $("#end").datepicker("setDate", date2);
    $("#end").datepicker("minDate", date2);
     $('#end').datepicker( "option", "minDate", date2 );


});

Here is the jsfiddle link

Upvotes: 2

Views: 9437

Answers (4)

simonata
simonata

Reputation: 29

<html>
<input asp-for="StartDate" class="form-control datepicker" type="text" autocomplete="off" />
<input asp-for="EndDate" class="form-control datepicker" asp-format="{0:dd.MM.yyyy}" type="text" autocomplete="off" />

<script>
    $('#StartDate').datepicker({
                keyboardNavigation: false,
                autoclose: true,
                changeMonth: true,
                changeYear: true,
                format: "dd.mm.yyyy",
                language: "tr",
                startDate: new Date('2021,1,1'),
     });

     $('#EndDate').datepicker({
                keyboardNavigation: false,
                autoclose: true,
                changeMonth: true,
                changeYear: true,
                format: "dd.mm.yyyy",
                language: "tr",
            
     });

    $("#StartDate").on("change", function (e) {
            var secondDate = $("#StartDate").datepicker("getDate");
            secondDate.setDate(secondDate.getDate() + 1);
            $("#EndDate").datepicker("setStartDate", secondDate);
    });

</script>
</html>

Upvotes: 0

chri3g91
chri3g91

Reputation: 1410

    $(function () {    
        $("#start").change(() => {
            let secondDate = $("#start").datepicker("getDate");
            secondDate.setDate(secondDate.getDate() + 1);
            $("#end").datepicker("setStartDate", secondDate);
            $("#end").datepicker('setDate', fromDate);
        });           
    });

Upvotes: 0

Murugan Deva
Murugan Deva

Reputation: 62

This is only thing you need to do for set mindate.This is the way to set mindate using datepicker.

$("#start").change( function() {    
   $( ".date_picker_hotel_to" ).datepicker("option", "minDate", $("#start").val());   
 });

Upvotes: 2

Arun P Johny
Arun P Johny

Reputation: 388316

Use the onSelect callback option

$('.date_picker_hotel_from').datepicker({
  setDate: new Date(),
  format: 'dd/mm/yyyy',
  todayHighlight: true,
  autoclose: true,
  startDate: '-0m',
  minDate: 0,
  onSelect: function(text, dt) {
    $('#end').datepicker('option', 'minDate', text);
  }
});

$('.date_picker_hotel_to').datepicker({
  //setDate: new Date(),
  format: 'dd/mm/yyyy',
  todayHighlight: true,
  autoclose: true,
  startDate: '+1d',
  minDate: 0,

});
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>
<link href="http://code.jquery.com/ui/1.8.18/themes/base/jquery-ui.css" rel="stylesheet" />
<input type="text" size="30" class="date_picker_hotel_from form-control valid" id="start" value="" name="start" aria-invalid="false">

<input type="text" size="30" class="date_picker_hotel_to form-control valid" id="end" value="" name="end" aria-invalid="false">

Upvotes: 1

Related Questions