<script>
var calendarInstance1 = new calendarJs( "calendar", {
manualEditingEnabled: true
// All your options can be set here
} );
// OR
var calendarElement = document.getElementById( "calendar" );
var calendarInstance2 = new calendarJs( calendarElement, {
manualEditingEnabled: true
// All your options can be set here
} );
</script>
You can also create new Calendars using the jQuery Plugin, or by using Data Bindings. See the test HTML files for examples.
5. Finishing Up:
That's it! Nice and simple. Please refer to the code if you need more help (fully documented).
How do I go about customizing Calendar.js and add events?
To customize, and get more out of Calendar.js, please read through the following documentation.
1. Options:
Options (which can be set when initializing, or afterwards) allow you to customize how Calendar.js will look and function. The options are also used to set the custom triggers you want to fire when specific actions occur. You can set them manually as follows:
To see a list of all the available event properties and how they should be formatted, click here.
3. Holiday Object Format:
A holiday is a piece of text that is shown under the day number in the month it is assigned to. You can set these holidays in the options, or add them manually as follows:
<script>
var holiday = {
day: today.getDate(),
month: today.getMonth() + 1,
title: "A New Holiday",
};
// This is a public function that you can call
calendarInstance.addHolidays( [ holiday ] );
</script>
To see a list of all the available holiday properties and how they should be formatted, click here.
4. Public Functions:
To see a list of all the public functions available, click here.
5. Search Options:
Search Options allow you to customize how Calendar.js Search dialog will function. You can set them manually as follows:
