bootstrap datetimepicker - 设置maxDate相对于现在？

Question

I use this datetimepicker:
http://eonasdan.github.io/bootstrap-datetimepicker/Options/
Basically I want to set maxDate: moment() , ie maxDate should be limited to now. The problem is by the time the datepicker is opened maxDate is not now() anymore. I want to set it maxDate to now everytime the datepicker is shown.

I want to enforce it globally if possible, not to specify it on every datetimepicker() instance. Is it possible to somehow give a relative date to now using moment.js ?

See this fiddle:
https://jsfiddle.net/0Ltv25o8/3281/
I set maxDate to now. You'll see after minute from the page load, you won't be able to choose the current minutes using the arrow buttons.

Answer 1

How about using custom version of datepicker plugin?

I have added new parameter maxDateNow (any ideas for a better name?) that allows selecting date/time up to present time.

$('#datetimepicker1').datetimepicker({maxDateNow: true, format:'DD/MM/YYYY HH:mm'});

See this fiddle

Answer 2

You can listen to dp.show event so you can change maxDate to the current time every time the picker shows. Here a code example:

 $('#datetimepicker1').datetimepicker({ maxDate: moment(), format:'DD/MM/YYYY HH:mm' }).on('dp.show', function(){ $('#datetimepicker1').data("DateTimePicker").maxDate(moment()); }); 

 <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/> <link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> <div class="form-group"> <div class="input-group date" id="datetimepicker1"> <input type="text" class="form-control" /> <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span> </div> </div> 

Answer 3

我使用了喜欢这个，它将最小日期设置为今天的日期

 $( '#Field_ID' ).datepicker({dateFormat: 'dd-MM-yy', minDate : new Date()});