A new version of the JavaScript Calendar events page is available here.

Calendar Events on v5

JavaScript Calendar and Time Picker Events

This section provides more information about the events on the javascript calendar plugin.

Documentation

The calendar provides the following events:

Event	description
onopen	`onopen(el: DOMElement) => void` This method is called when the calendar is opened.
onclose	`onclose(el: DOMElement) => void` This method is called when the calendar is closed.
onchange	`onchange(DOMElement element, string currentValue, string previousValue) => void` This method is called when the value is changed.
onupdate	`onupdate(DOMElement element, string value) => void` This method is called when a information changes.

Example

<html>
<script src="https://jsuites.net/v4/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />

<input id='calendar' />
<div id='log'></div>

<script>
// Create a instance of the calendar
jSuites.calendar(document.getElementById('calendar'), {
    time: true,
    format: 'DD/MM/YYYY',
    placeholder: 'DD/MM/YYYY',
    readonly: false,
    // Enable events on the calendar
    onopen: function() {
        jSuites.notification({ title:'Calendar', message:'Calendar is open now!' });
    },
    onclose: function() {
        jSuites.notification({ title:'Calendar', message:'Calendar is closed now!' });
    },
    onchange: function(instance, value) {
        document.getElementById('log').innerText = 'New value is: ' + value;
    }
});
</script>
</html>

Edit this page on GitHub