为另一个Bootstrap DateTimePicker设置minDate

Question

Currently, I'm using Bootstrap 3 Datepicker from this source

I have 2 datetimepicker on my system. ( startTime , endTime ).

I tried but don't know how to set minDate for endTime from startTime value whenever startTime value changed. Even it don't jump on change event.

Please point me what am I missing.

Here is my code

Many thanks.

Answer 1

You need to use the change event and minDate() function like

 $('#txtStartTime').datetimepicker({ showTodayButton: true, format: 'MM/DD/YYYY HH:mm', sideBySide: true, maxDate: moment() }).on('dp.change', function(e) { $('#txtEndTime').data("DateTimePicker").minDate(e.date) }); $('#txtEndTime').datetimepicker({ showTodayButton: true, format: 'MM/DD/YYYY HH:mm', sideBySide: true }); 

 <script type="text/javascript" src="//code.jquery.com/jquery-1.10.1.js"></script> <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.css"> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> <div class="row">.</div> <div class="col-md-3"> <input class="form-control datetimepicker" id="txtStartTime" type='text' /> </div> <div class="col-md-3"> <input class="form-control datetimepicker" id="txtEndTime" type='text' /> </div>