Bootstrap datetimepicker mindate

Question

I am using https://github.com/Eonasdan/bootstrap-datetimepicker in my web app to show datetimepicker.

I have 2 controls - startDate and endDate I want to set minDate for 'endDate' as greater than 'startDate'.

This plugin provides an option of 'minDate'. However, how do I set the value for it from another datetimepicker field?

I tried to do as follows.

$('#start-date-time-datepicker').datetimepicker({
    minDate: moment(),
    sideBySide: true,
    daysOfWeekDisabled: [0,6]
});

$('#end-date-time-datepicker').datetimepicker({
    minDate: $('#start-date-time-datepicker').val(),
    sideBySide: true,
    daysOfWeekDisabled: [0,6]
});

But it is not working.

Can someone please provide some pointers?

Answer 1

You need to bind the date pickers

$(function () {
    $('#start_date').datetimepicker({
     // custom config
    });
    $('#end_date').datetimepicker({
        // custom config
    });
    $("#start_date").on("dp.change", function (e) {
        $('#end_date').data("DateTimePicker").minDate(e.date);
    });
    $("#end_date").on("dp.change", function (e) {
        $('#start_date').data("DateTimePicker").maxDate(e.date);
    });
});

ref: http://eonasdan.github.io/bootstrap-datetimepicker/#linked-pickers