jquery datepicker range (mindate maxdate) is not working

Question

I'm trying to set a range for a jquery datepicker that I have on my form but when I open the form it allows me to select any date.

  <input class="span2 datepicker" name="tw#local#changeRequest#DeliveryDate" type="text" id="dp1">


 <!-- jQuery -->
 <script type="text/javascript" src="<#=tw.system.model.findManagedFileByPath('jquery-1.7.2.min.js', TWManagedFile.Types.Web).url;#>"></script>

 <!-- Datepicker Script -->
 <script type="text/javascript" src="<#=tw.system.model.findManagedFileByPath('bootstrap-datepicker_new.js', TWManagedFile.Types.Web).url;#>"></script>

 <script type="text/javascript">
 $(document).ready(function(){

 $( "#datepicker" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });

 });
 </script>

Answer 1

As far as I know, it should be done like this:

$("#datepicker").datepicker('option', {minDate: <some date>, maxDate: <some date>});

What you are missing is that you should set them using 'option'.

Answer 2

$('#datepicker').datepicker({
            maxDate: '0'}),

Use '0' for select max date today

You can also reference jQueryUI Api

Answer 3

$('#datepicker').datepicker({
                maxDate: '+1m',
                minDate: '-20d',
                });

When min and max date are expressions they should be as strings and properly defined. Here is link for jquery ui datepicker MaxDate section.

Answer 4

One more thing, you might have noticed that already, but your selector is searching for ID as "datepicker". Whereas, your datepicker is your CLASS. So I think you need to change from "#datepicker" to ".datepicker".

Answer 5

just add in controller if you are using angularjs $scope.today = new Date()

and in html min-date="today"

Answer 6

You can also test this.

$('#datepicker1').datepicker({
  format: 'mm/dd/yyyy',
});

$('#datepicker1').on('change', function() {
  $('#datepicker2').datepicker({
    startDate: $('#datepicker1').val()
  })
});