Календарь / DatePicker с заблокированными датами

Question

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

Мне нужна страница, на которой отображается календарь / средство выбора даты (не активируется всплывающим окном).) всегда и имеет все прошлые даты, сегодняшнюю дату и 3 дня в будущем, заблокированные.Затем пользователь может выбрать из доступных дат, которые затем отправляются клиенту.

Любая помощь будет принята с благодарностью!

Answer 1

Проверьте следующие ссылки: http://jqueryui.com/demos/datepicker/#inline http://jqueryui.com/demos/datepicker/#min-max

Описание говорит это: «Установите даты начала и окончания как фактические даты (новая Дата (2009, 1 - 1, 26)), как числовое смещение от сегодняшнего дня (-20) или как строку периодов и единиц ( '+ 1M + 10D') "

Answer 2

это можно сделать двумя типами

1. установить mindate и maxdate
2. , когда вы открываете указатель даты и меняете месяц / год, он будет запускать событие beforeShowDay с каждой датойв этот месяц и год, и вы можете проверить каждую дату в этой функции с помощью массива или объекта диапазона дат и вернуть true или false.В случае ложного возврата эта дата будет неактивной, а по истине эта дата будет активной

Answer 3

Вот пример того, как всегда отображать календарь:

http://jqueryui.com/demos/datepicker/#inline

Похоже, что функция затемнения даты может быть достигнута с помощью обратного вызова beforeShowDay или просто установив календарь min / max.

http://jqueryui.com/demos/datepicker/#min-max

http://forum.jquery.com/topic/custom-callback-to-disable-specific-dates-in-datepicker

$('#datepicker').datepicker({..., beforeShowDay: allowedDates});

function allowedDates(date) {
      for (var i = 0; i < jsForbiddenDatesArray.length; i++) {
            if (date.getTime() == jsForbiddenDatesArray[i].getTime()) {
                  return [false, ''];
            }
      }
      return $.datepicker.noWeekends(date);
}

Answer 4

http://docs.jquery.com/UI/Datepicker#options

См. minDate и maxDate