Действия

onClickDate()

Type: Function

Default: null

Options: onClickDate(self, event) => void | null

new Calendar('#calendar', {
  onClickDate(self, event) {},
});

Этот метод срабатывает после нажатия на день в календаре. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
event - событие мыши.

Важно знать, что каждый HTML-элемент дня, содержит data-атрибут, внутри которого находится полная дата в формате YYYY-MM-DD. Если вам нужно получить день, месяц, год отдельно, то вы можете использовать стандартные методы JS. В качестве примера: new Date('2022-11-07').getDate() вернет 7.

onClickWeekDay()

Type: Function

Default: null

Options: onClickWeekDay(self, day, dateEls, event) => void | null

new Calendar('#calendar', {
  onClickWeekDay(self, day, dateEls, event) {},
});

Этот метод срабатывает после нажатия на день недели в календаре. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
day - день недели;
dateEls - массив дней (html-элементов);
event - событие мыши.

onClickWeekNumber()

Type: Function

Default: null

Options: onClickWeekNumber(self, number, year, dateEls, event) => void | null

new Calendar('#calendar', {
  onClickWeekNumber(self, number, year, dateEls, event) {},
});

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

self - ссылка на инициализированный календарь;
number - номер недели;
year - год недели;
dateEls - массив дней (html-элементов);
event - событие мыши.

onClickTitle()

Type: Function

Default: null

Options: onClickTitle(self, event) => void | null

new Calendar('#calendar', {
  onClickTitle(self, event) {},
});

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

self - ссылка на инициализированный календарь;
event - событие мыши.

onClickMonth()

Type: Function

Default: null

Options: onClickMonth(self, event) => void | null

new Calendar('#calendar', {
  onClickMonth(self, event) {},
});

Этот метод срабатывает после выбора месяца в календаре. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
event - событие мыши.

onClickYear()

Type: Function

Default: null

Options: onClickYear(self, event) => void | null

new Calendar('#calendar', {
  onClickYear(self, event) {},
});

Этот метод срабатывает после выбора года в календаре. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
event - событие мыши.

onClickArrow()

Type: Function

Default: null

Options: onClickArrow(self, event) => void | null

new Calendar('#calendar', {
  onClickArrow(self, event) {},
});

Этот метод срабатывает после клика на стрелочку в календаре. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
event - событие мыши.

onChangeTime()

Type: Function

Default: null

Options: onChangeTime(self, event, isError) => void | null

new Calendar('#calendar', {
  onChangeTime(self, event) {},
});

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

self - ссылка на инициализированный календарь;
event - событие change;
isError - возвращает true, если пользователь ввел неверное время.

onChangeToInput()

Type: Function

Default: null

Options: onChangeToInput(self, event) => void | null

new Calendar('#calendar', {
  onChangeToInput(self, event) {},
});

Для работы этого метода необходим параметр inputMode с значением true. Этот метод срабатывает после нажатия на день в календаре или изменения времени любым способом. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
event - событие.

onCreateDateRangeTooltip()

Type: Function

Default: null

Options: onCreateDateRangeTooltip(self, dateEl, tooltipEl, dateElBCR, mainElBCR) => void | null

new Calendar('#calendar', {
  onCreateDateRangeTooltip(self, dateEl, tooltipEl, dateElBCR, mainElBCR) {},
});

Позволяет создать подсказку для диапазона дат. Срабатывает при нажатии и наведении курсора мыши на день, если для параметра selectionDatesMode установлено значание 'multiple-ranged'. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь.
dateEl - HTML элемент даты;
tooltipEl - HTML элемент подсказки;
dateElBCR - объект с информацией о положении и размере HTML элемента даты;
mainElBCR - объект с информацией о положении и размере основного HTML элемента календаря.

onCreateDateEls()

Type: Function

Default: null

Options: onCreateDateEls(self, dateEl) => void | null

new Calendar('#calendar', {
  onCreateDateEls(self, dateEl) {},
});

Этот метод срабатывает при инициализации календаря и при любых изменениях. Он предоставляет доступ к информации о каждом дне. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
dateEl - HTML элемент даты.

onCreateMonthEls()

Type: Function

Default: null

Options: onCreateMonthEls(self, monthEl) => void | null

new Calendar('#calendar', {
  onCreateMonthEls(self, monthEl) {},
});

Этот метод срабатывает, когда тип календаря установлен на 'month'. Тип календаря также становится 'month', когда пользователь кликает на заголовок месяца или при инициализации с параметром type = 'month'. Он предоставляет доступ к информации о каждом месяце. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
monthEl - HTML элемент месяца.

onCreateYearEls()

Type: Function

Default: null

Options: onCreateYearEls(self, yearEl) => void | null

new Calendar('#calendar', {
  onCreateYearEls(self, yearEl) {},
});

Этот метод срабатывает, когда тип календаря установлен на 'year'. Тип календаря становится 'year', когда пользователь кликает на заголовок года или при инициализации с параметром type = 'year'. Он предоставляет доступ к информации о каждом годе. Вы можете получить следующие параметры:

self - ссылка на инициализированный календарь;
yearEl - HTML элемент года.

onInit()

Type: Function

Default: null

Options: onInit(self) => void | null

new Calendar('#calendar', {
  onInit(self) {},
});

Этот метод срабатывает при инициализации календаря. Если для параметра inputMode установлено значение true, то метод отработает при первом отображении календаря, поскольку в этот момент инициализируется календарь.

self - ссылка на инициализированный календарь.

onUpdate()

Type: Function

Default: null

Options: onUpdate(self) => void | null

new Calendar('#calendar', {
  onUpdate(self) {},
});

Этот метод срабатывает при обновлении/сбросе календаря с помощью метода .update().

self - ссылка на инициализированный календарь.

onDestroy()

Type: Function

Default: null

Options: onDestroy(self) => void | null

new Calendar('#calendar', {
  onDestroy(self) {},
});

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

self - ссылка на инициализированный календарь.

onShow()

Type: Function

Default: null

Options: onShow(self) => void | null

new Calendar('#calendar', {
  onShow(self) {},
});

Этот метод срабатывает при отображении календаря пользователю, но только если для параметра inputMode установлено значение true.

self - ссылка на инициализированный календарь.

onHide()

Type: Function

Default: null

Options: onHide(self) => void | null

new Calendar('#calendar', {
  onHide(self) {},
});

Этот метод срабатывает при скрытии календаря, но только если для параметра inputMode установлено значение true.

self - ссылка на инициализированный календарь.