DateTime picker minDate and range between them

Question

I'm using DateTime picker and I can't manage how to make a minDate the day after tommorow. The second problem is how to set 3 days minimum range between them.

For example: today is 2014/10/29 and the minimum day to select should be 2014/11/01. If I select 2014/11/01 in first DateTime picker, there should be a range which wouldn't allow to select less than 2014/11/04 in DateTime picker two.

Thank you for your help...

http://jsfiddle.net/ajmtj1xj/2/

    var d1 = null;
var d2 = null;

jQuery('#datetimepicker3').datetimepicker({
  format:'Y/m/d H:i',
  dayOfWeekStart:'1',
  value:'12:00',
  inline:true,
  lang:'ru',
    onChangeDateTime:function(dp,$input){
    d1 = new Date($input.val());
        calcDiff();
  }

});

jQuery('#datetimepicker2').datetimepicker({
  format:'Y/m/d H:i',
  dayOfWeekStart:'1',
  value:'12:00',
  inline:true,
  lang:'ru',
    onChangeDateTime:function(dp,$input){
        d2 = new Date($input.val());
 calcDiff();
  }

});

function calcDiff(){
    if(d1 != null && d2 != null){ // We have both dates
        var dh = (d2 - d1) / 1000 / 60 / 60;
        $("#difference").val(dh);
    }
}

Answer 1

You can achieve this with the following code. The trick is to destroy the second datetimepicker and rerendering it with a new minDate value.

$(document).ready(function () {
    var today = new Date();
    // Add one extra day when today from Sunday to Thursday and two extra days when today is Friday or Saturday.
    var plusStartDays = 3 + (today.getDay() <= 4 ? 1 : 2);

    var minStart = new Date(today);
    minStart.setDate(today.getDate() + plusStartDays);

    var minEnd = new Date(minStart);
    minEnd.setDate(minEnd.getDate() + 3);

    $("#start").datetimepicker({
        format: "Y/m/d H:i",
        dayOfWeekStart: "1",
        value: "12:00",
        inline: true,
        lang: "nl",
        onSelectDate: function (ct) {
            var diff = CalcDiff();

            var minDate = new Date(ct);
            minDate.setDate(minDate.getDate() + 3);

            if (diff > 72)
                var defDate = new Date($("#end").val());

            $("#end").datetimepicker("destroy");
            $("#end").datetimepicker({
                format: "Y/m/d H:i",
                dayOfWeekStart: "1",
                value: "12:00",
                inline: true,
                lang: "nl",
                minDate: minDate,
                defaultDate: defDate || minDate,
                onSelectDate: function (ct) {
                    CalcDiff();
                },
                onSelectTime: function (ct) {
                    CalcDiff();
                }
            }).val(defDate || minDate);

            CalcDiff();
        },
        onSelectTime: function (ct) {
            CalcDiff();
        },
        minDate: minStart,
        defaultDate: minStart
    }).val(minStart);

    $("#end").datetimepicker({
        format: "Y/m/d H:i",
        dayOfWeekStart: "1",
        value: "12:00",
        inline: true,
        lang: "nl",
        minDate: minEnd,
        defaultDate: minEnd,
        onSelectDate: function (ct) {
            CalcDiff();
        },
        onSelectTime: function (ct) {
            CalcDiff();
        }
    }).val(minEnd);

    CalcDiff();
});

function CalcDiff() {
    var start = new Date($("#start").val());
    var end = new Date($("#end").val());

    if (start != null && end != null) { // We have both dates
        var hours = Math.round((end - start) / 36e5);
        $("#difference").val(hours);
    }

    return hours;
}

See this FIDDLE for a working example.

Edit: updated the Fiddle with a fix for skipping a month on the last day of the month and a fix for selecting a start date more than 3 days later than the current selected end date.

Edit 2: added one extra day to start date when today is from Sunday to Thursday and two extra days when today is Friday or Saturday.