admin管理员组

文章数量:1391925

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

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

  • javascript
  • jquery
  • datepicker
Share Improve this question asked Jul 28, 2016 at 9:13 vellai duraivellai durai 1,0113 gold badges19 silver badges41 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 2

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

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./ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="//code.jquery./ui/1.8.18/jquery-ui.min.js"></script>
<link href="http://code.jquery./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">

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

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

本文标签： javascriptSet mindate in bootstrap datepickerStack Overflow

版权声明：本文标题：javascript - Set mindate in bootstrap datepicker - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744697112a2620344.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。