Copyright © 2023 MIT License. | Design and development by Yury Uvarov.
💢 Usage example

biletiki.store — a website example for searching for flight tickets and hotels using vanilla-calendar.

Main

Initialization, Update, Reset, and Destroy

The init() method is the main method of the instance, which initiates the calendar's initialization process.

js
const calendar = new VanillaCalendar(element, params);
calendar.init();
js
const calendar = new VanillaCalendar(element, params);
calendar.init();

The update() method allows you to apply new settings to the calendar and reset it. This method takes an object with optional arguments to control the reset, by default retaining the user-selected date, month, and year after the update.

All arguments, default false:

ts
{
  year: boolean;
  month: boolean;
  dates: boolean | 'only-first';
  holidays: boolean;
  time: boolean;
}
ts
{
  year: boolean;
  month: boolean;
  dates: boolean | 'only-first';
  holidays: boolean;
  time: boolean;
}
  • true - will be reset to the parameters specified in settings;
  • false - will not perform a reset, will leave the parameters selected by the user;
  • 'only-first' - resets all selected dates, leaving the earliest one. If the date picker type is specified as 'multiple-ranged', a 'mousemove' and 'keydown' handler is added for the hover.

Example of usage:

js
calendar.settings.lang = 'de-AT';
calendar.settings.iso8601 = false;
 
calendar.update({
	dates: true,
});
js
calendar.settings.lang = 'de-AT';
calendar.settings.iso8601 = false;
 
calendar.update({
	dates: true,
});

Additionally, if you want to completely remove the calendar instance, you can use the destroy() method.

Example of usage:

js
calendar.destroy();
js
calendar.destroy();