Выбор DateTime minDate и диапазон между ними

Я использую палитру DateTime и не могу определить, как сделать minDate на следующий день после завтрашнего дня. Вторая проблема заключается в том, как установить минимальный диапазон 3 дня между ними.

Например: сегодня 2014/10/29, а минимальный день для выбора должен быть 2014/11/01. Если я выберу 2014/11/01 в первом средстве выбора DateTime, должен быть диапазон, который не позволял бы выбирать меньше 2014/11/04 во втором средстве выбора DateTime.

Спасибо за помощь...

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);
    }
}

1 ответ

Решение

Вы можете достичь этого с помощью следующего кода. Хитрость заключается в том, чтобы уничтожить второй datetimepicker и перерисовать его с новым minDate значение.

$(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;
}

Смотрите этот FIDDLE для рабочего примера.

Изменить: обновлена ​​скрипка с исправлением для пропуска месяца в последний день месяца и исправлением для выбора даты начала более чем на 3 дня позже текущей выбранной даты окончания.

Изменить 2: добавлен один дополнительный день к дате начала, когда сегодня с воскресенья по четверг, и два дополнительных дня, когда сегодня пятница или суббота.

Другие вопросы по тегам