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, params?)

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

newOpts
object
 — новые опции календаря, поддерживаются почти все опции, которые можно передать изначально.
params.silent
boolean
 — если true, то onSelect и onChangeView не будут вызваны
setCurrentView(view, params?)

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

view
"days" | "months" | "years"
 — новое представление
params.silent
boolean
 — если true, то коллбэк onChangeView не будет вызван
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
 — если передана дата, то при смене представления будет изменена дата отображения.
getViewDates(view?)
(days|months|years) => Date[]

Возвращает все даты, которые должны быть отображены в календаре.

disableDate(date)
((date: Date|string|number|Array<Date|string|number>)) => void

Деактивирует одну или несколько дат.

enableDate(date)
((date: Date|string|number|Array<Date|string|number>)) => void

Активирует даты, которые ранее были деактивированы.

Свойства

$datepicker
HTMLDivElement

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

$el
HTMLInputElement

Ссылка на DOM элемент на котором была произведена инициализация календаря. Тип элемента зависит от дженерика, который можно передать при инициализации, по умолчанию HTMLInputElement.

viewDate
Date

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

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

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

selectedDates
Date[]

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

focusDate
Date | false

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

visible
boolean

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

disabledDates
Set<string>

Set, где хранятся все деактивированные даты

isDestroyed
boolean

Если true, значит календарь был уничтожен с помощью destroy()