Параметр defaultDate

Параметр defaultDate определяет начальное значение даты, которое будет установлено в календаре при инициализации экземпляра. Он влияет на поведение виджета в момент первого рендера и задаёт внутреннее состояние выбранной даты до взаимодействия пользователя с интерфейсом.

Тип значения и допустимые форматы

defaultDate принимает объект типа Date JavaScript. Передача строк, чисел или иных форматов напрямую не является стандартной практикой и может привести к некорректному поведению или необходимости предварительного преобразования.

Корректная форма:

defaultDate: new Date(2026, 0, 15)

Здесь используется стандартный конструктор Date(year, monthIndex, day), где месяц начинается с нуля.

Поведение при инициализации

При указании defaultDate библиотека устанавливает внутреннюю дату выбора, даже если поле ввода остаётся пустым или не синхронизировано с полем field.

В момент создания экземпляра выполняется следующая логика:

  • создаётся объект календаря
  • проверяется наличие setDefaultDate
  • если defaultDate задан, он применяется как активная дата
  • отображение календаря синхронизируется с этим значением

Важно, что defaultDate не обязательно отображается в поле ввода, если не задано setInputValue или пользователь не активировал выбор.

Отличие от setDate и field.value

defaultDate часто путают с методами установки значения после инициализации.

defaultDate

Используется только на этапе создания экземпляра. Определяет стартовое состояние.

setDate

Метод, который изменяет выбранную дату после инициализации:

picker.setDate(new Date(2026, 5, 10))

field.value

HTML-значение input-поля, которое может быть не синхронизировано с внутренним состоянием календаря.

Поведение при отсутствии defaultDate

Если параметр не указан:

  • календарь открывается без выбранной даты
  • текущий месяц определяется по new Date()
  • поле ввода остаётся пустым (если не задано значение извне)

Это поведение важно для форм, где требуется явный выбор даты без предустановленных значений.

Взаимодействие с setDefaultDate

В некоторых конфигурациях используется параметр setDefaultDate, который изменяет поведение применения defaultDate.

setDefaultDate: true,
defaultDate: new Date(2026, 0, 1)

Если setDefaultDate включён:

  • значение defaultDate автоматически применяется как выбранная дата
  • поле ввода может быть сразу заполнено форматированным значением
  • календарь открывается с активным выделением даты

Если setDefaultDate отключён:

  • defaultDate влияет только на внутреннее состояние
  • поле ввода остаётся неизменным до действия пользователя

Сценарии применения

Предустановка текущей даты

defaultDate: new Date()

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

Фиксированная стартовая дата

defaultDate: new Date(2026, 11, 31)

Применяется в формах планирования, где логика предполагает выбор даты относительно конкретного периода.

Работа с ограниченными диапазонами

В сочетании с minDate и maxDate:

minDate: new Date(2026, 0, 1),
maxDate: new Date(2026, 11, 31),
defaultDate: new Date(2026, 6, 1)

В этом случае defaultDate должен находиться внутри диапазона. Если он выходит за пределы, библиотека может скорректировать его или игнорировать в зависимости от конфигурации.

Поведение при некорректных значениях

Если в defaultDate передано некорректное значение:

  • undefined или null → игнорируется
  • строка → может быть интерпретирована как Date, но нестабильно
  • некорректный Date (Invalid Date) → значение не применяется

Пример проблемного случая:

defaultDate: new Date("invalid-date")

Такое значение приводит к отсутствию предустановленной даты.

Влияние на отображение календаря

defaultDate напрямую влияет на:

  • начальный месяц отображения
  • активную ячейку календарной сетки
  • внутренний state выбранной даты

Если defaultDate находится в другом месяце, календарь автоматически переключается на соответствующий месяц.

Синхронизация с пользовательским вводом

При наличии связанного поля ввода (field) поведение зависит от конфигурации:

  • если поле пустое → может быть заполнено при включённом setDefaultDate
  • если поле уже содержит значение → defaultDate игнорируется в пользу field.value
  • при изменении пользователем → defaultDate перестаёт влиять на состояние

Практические особенности использования

В реальных интерфейсах defaultDate используется как механизм инициализации состояния, но не как источник истины после загрузки компонента. Его роль ограничена первым рендером и начальной синхронизацией календаря.

При архитектуре форм с серверной предзагрузкой данных defaultDate часто заменяется динамическим значением, вычисленным на основе бизнес-логики:

defaultDate: user.lastVisitDate || new Date()

Связь с форматированием даты

defaultDate не влияет на формат отображения даты. За формат отвечает параметр format, и оба параметра работают независимо:

  • defaultDate задаёт значение
  • format определяет способ отображения

Даже при одинаковом значении даты отображение может различаться:

format: 'DD.MM.YYYY',
defaultDate: new Date(2026, 0, 1)

Особенности в многоэкземплярных сценариях

При создании нескольких экземпляров календаря важно учитывать, что каждый экземпляр хранит собственное значение defaultDate. Изменение объекта Date, переданного в один экземпляр, не влияет на другие, если не используется общая ссылка на объект.

const sharedDate = new Date(2026, 0, 1)

new Pikaday({ defaultDate: sharedDate })
new Pikaday({ defaultDate: sharedDate })

Несмотря на общую ссылку, внутреннее состояние каждого экземпляра изолировано.

Оглавление