API

AirDatepicker обладает удобным API, дающий еще больше контроля над компонентом. Доступ к методам осуществляется через ссылку на экземпляр календаря:

let dp = new AirDatepicker('#el');

dp.show();

Методы

show()

Показывает календарь

hide()

Скрывает календарь

Переход к следующему месяцу/году/декаде.

Переход к прошлому месяцу/году/декаде.

selectDate(date | date[], opts?)

Выбирает одну или сразу несколько дат, если передать массив.

date
Date | string | number
 — дата в формате Date или строка в ISO формате или время в миллисекундах. Если строку или число не удастся преобразовать в дату, то это значение будет проигнорировано.
opts.updateTime
boolean
 — если передать true, то время из переданной даты будет установлено в значение виджета выбора времени. По умолчанию false - при выборе даты устанавливается текущее время.
opts.silent
boolean
 — если true, то событие onSelect() не будет вызвано.
unselectDate(date)

Снимает выбор с переданной даты.

date
Date | string | number
 — дата, которую нужно удалить
clear(opts)

Очищает все выбранные даты.

opts.silent
boolean
 — если true, то событие onSelect() не будет вызвано.
formatDate(date, format)

Форматирует дату в переданный формат.

date
Date | string | number
 — дата, которую нужно отформатировать
format
string
 — формат даты, принимает значения из опции dateFormat. Список возможных символов можно посмотреть в в разделе документации
destroy()

Уничтожает экземпляр календаря. Удаляет себя из DOM дерева и все события с целевого элемента.

update(newOpts)

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

newOpts
object
 — новые опции календаря, поддерживаются почти все опции, которые можно передать изначально.
setCurrentView(view)

Устанавливает новое значение представления календаря.

view
"days" | "months" | "years"
 — новое представление
setViewDate(date)

Устанавливает новую дату отображения календаря. Используется, когда, к примеру, нужно показать какой-то другой месяц без необходимости выбора даты.

date
Date | string | number
 — новая дата. Если не удастся преобразовать строку или число в дату, то вызов игнорируется.
setFocusDate(date, opts?)

Устанавливает фокус на ячейку с переданной датой.

date
Date | string | number
 — новая дата. Если не удастся преобразовать строку или число в дату, то вызов игнорируется.
opts.viewDateTransition
boolean
 — если true и новая дата находится за пределами текущего отображения, то будет установлена новая дата отображения.
up(date?)

Переход к следующему типу отображению. Варианты отображения идут по порядку от days -> months -> years.

date
Date | string | number
 — если передана дата, то при смене представления будет изменена дата отображения.
down(date?)

Переход к предыдущему типу отображения.

date
Date | string | number
 — если передана дата, то при смене представления будет изменена дата отображения.

Свойства

$datepicker
HTMLElement

Ссылка на DOM элемент календаря.

viewDate
Date

Текущая дата отображения

currentView
"days" | "months" | "years"

Текущее представление календаря.

selectedDates
Date[]

Массив выбранных дат

focusDate
Date | false

Дата, находящаяся в фокусе.

visible
boolean

Показан ли сейчас календарь