Как отключить даты до сегодняшнего дня в JQuery DatePicker

Question

Как отключить даты до сегодняшнего дня в jQuery datepicker БЕЗ использования minDate: 0?

Я хотел бы включить навигацию по календарю, как обычно до сегодняшнего дня, при этом убедившись, что пользовательНЕ выбирайте даты до сегодняшнего дня.

(то есть, скажем, сегодняшняя дата - 11 августа, и я хотел бы, чтобы все даты до этого были отключены, но все же позволяли пользователю переходить на предыдущие месяцы, годы и т. д.)

Answer 1

Хотя я согласен, что это странное поведение, вы можете подделать его, используя событие onSelect DatePicker.

$(document).ready(function() {
    $('#Date').datepicker({
        onSelect: function(dateText, inst) {
            //Get today's date at midnight
            var today = new Date();
            today = Date.parse(today.getMonth()+1+'/'+today.getDate()+'/'+today.getFullYear());
            //Get the selected date (also at midnight)
            var selDate = Date.parse(dateText);

            if(selDate < today) {
                //If the selected date was before today, continue to show the datepicker
                $('#Date').val('');
                $(inst).datepicker('show');
            }
        }
    });
});

По сути, вы обрабатываете onSelect событие.

Когда выбрана дата, проверьте, не наступила ли она до сегодняшней даты.

Если равно , вы немедленно покажете средство выбора даты снова и очистите поле ввода, прикрепленное к нему.

---

Обновлено Пример кода теперь полностью функционален.Вот jsfiddle для демонстрации.

Answer 2

Надеюсь, это еще кому-нибудь пригодится. Мое решение состоит в том, чтобы поставить чеки на отдельные даты, как это:

$("#StartDate").datepicker({ dateFormat: 'yy-mm-dd',  beforeShowDay: NotBeforeToday});



function NotBeforeToday(date)
{
    var now = new Date();//this gets the current date and time
    if (date.getFullYear() == now.getFullYear() && date.getMonth() == now.getMonth() && date.getDate() > now.getDate())
        return [true];
    if (date.getFullYear() >= now.getFullYear() && date.getMonth() > now.getMonth())
       return [true];
     if (date.getFullYear() > now.getFullYear())
       return [true];
    return [false];
}

Я считаю это простым и элегантным

Answer 3

простейшее решение может ....

<script type="text/javascript">$('#date').datepicker({ minDate: 0 });</script>

Answer 4

Вместо этого вы можете написать функцию в вашем файле .js следующим образом:

$(function () {

             var date = new Date();
             var currentMonth = date.getMonth();
             var currentDate = date.getDate();
             var currentYear = date.getFullYear();

            if($("#dateToSelect").length > 0){
                $("#dateToSelect").datepicker({
                 maxDate: new Date(currentYear, currentMonth, currentDate)
             });
            }
})

Здесь «dateToSelect» - это идентификатор поля, в котором отображается дата. Проверка длины даты здесь не обязательна.

Answer 5

Похоже, что не настраивается.В строке 1434 файла jquery.ui.datepicker.js , если указано maxDate, она устанавливает переменную maxDraw и рисует до месяца с этой датой, без учета других флагов.

Но я тоже согласен с zzzzBov.Зачем пользователю нужно видеть значения, которые он не может выбрать?