side_navigation

Assigning Custom Triggers

Explore how to create a Calendar.js instance that fires a custom trigger whenever a new calendar is added. This example demonstrates how to extend Calendar.js with event hooks to automate actions and enhance your calendar’s functionality.

Include Files

Make sure you include the following files:

<link rel="stylesheet" href="dist/calendar.js.css">
<script src="dist/calendar.min.js"></script>

Create DOM Element

Add a new DOM element to house the Calendar.js instance:

<div id="calendar"></div>

Create Calendar.js Instance

Run the following JavaScript to create a new Calendar.js instance:

const calendarInstance = new calendarJs( "calendar", {
    events: {
        onEventAdded: ( event ) => { alert( JSON.stringify( event ) ); }
    }
} );

Result

More Information

Need a different custom trigger? Explore the complete Calendar.js documentation here to see every supported trigger and learn how to use them in your projects.