Skip to main content

Event Handling

Attaching event listeners#

You can attach event listeners with the calendar.events.on() method of the events module:

calendar.events.on("change",function(date, oldDate, byClick){    console.log("Change selection from "+oldDate+" to "+date);    console.log(click);});

For example, Calendar can be attached to an input that will display the date selected in Calendar:

<input type="text" id="date" />
var calendar = new dhx.Calendar("calendar_container");calendar.events.on("change",(date)=>{     document.getElementById("date").value = date.getFullYear() +        "-" + (date.getMonth() + 1) + "-" +date.getDate();});

Several handlers can be attached to one event, and all of them will be executed.

note

The names of events are case-insensitive.

Related sample: Calendar. Events

Detaching event listeners#

To detach an event listener, use calendar.events.detach():

calendar.events.on("change",function(date, oldDate, byClick){    console.log("Change selection from "+oldDate+" to "+date);    console.log(click);});calendar.events.detach("change");

Calling events#

To call an event, use calendar.events.fire():

calendar.events.fire("name",args);// where args is an array of arguments

The list of events#

You can find the full list of events in the Calendar API.