Отключить дату до сегодняшнего дня с помощью datepicker

Question

Там я хочу, чтобы мой datepicker был отключен, когда дата меньше текущей.

эту ссылку, что я использую:

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
    <link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" /> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/> 

это мой JavaScript:

<script> 
    $(document).ready(function(){ 
     var date_input=$('input[name="date"]'); //our date input has the name "date" 
     var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body"; 
     var options={ 
     format: 'yyyy/mm/dd', 
     container: container, 
     todayHighlight: true, 
     autoclose: true, 
     }; 
     date_input.datepicker(options); 
    }) 
</script> 

я ве попробовать добавить minDate:'0' в моей JavaScript, но его до сих пор не делает Работа.

есть ли кто-нибудь, кто мне поможет, какое улучшение мне нужно в моем коде?

Answer 1

Вам нужно сделать что-то вроде этого:

$(document).ready(function(){ 
 
    var date_input=$('input[name="date"]'); //our date input has the name "date" 
 
    var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body"; 
 
    var options={ 
 
     format: 'yyyy/mm/dd', 
 
     container: container, 
 
     todayHighlight: true, 
 
     autoclose: true 
 
    }; 
 
    date_input.datepicker(options).change(dateChanged).on('changeDate', dateChanged); 
 
    function dateChanged(ev) { 
 
     var $this = $(this); 
 
     $this.datepicker('hide'); 
 
     var now = new Date(); 
 
     var today = new Date(now.getFullYear(), now.getMonth(), now.getDate()); 
 
     var selectedDate = Date.parse($this.val()); 
 
     if (selectedDate < today) { 
 
      $this.attr('disabled', true); 
 
     } else { 
 
      $this.removeAttr('disabled'); 
 
     } 
 
    } 
 

 
})

<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
 
<link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" /> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/> 
 

 
<input name="date">

Answer 2

minDate Используйте

var date = new Date(); 
var today = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 

$('#date').datepicker({ 
    minDate: today 
}); 

или

var today = new Date(date.getFullYear(), date.getMonth(), date.getDate()); 

    $(document).ready(function(){ 
    var date_input=$('input[name="date"]'); //our date input has the name "date" 
    var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body"; 
    var options={ 
    format: 'yyyy/mm/dd', 
    container: container, 
    todayHighlight: true, 
    autoclose: true, 
    minDate: today 
    }; 
    date_input.datepicker(options); 
}) 

Answer 3

$(document).ready(function() { 
$('#Date').datepicker({ 
    onSelect: function(dateText, inst) { 
     //Get today's date at midnight 
     var today = new Date(); 
     today = Date.parse(today.getMonth()+1+'/'+today.getDate()+'/'+today.getFullYear()); 
     //Get the selected date (also at midnight) 
     var selDate = Date.parse(dateText); 

     if(selDate < today) { 
      //If the selected date was before today, continue to show the datepicker 
      $('#Date').val(''); 
      $(inst).datepicker('show'); 
     } 
    } 
    }); 
}); 

Demo