Programmatically changes


Available methods in the javascript calendar

Method Description; Open the javascript calendar picker
calendar.close(ignoreEvents); Close the calendar
@param int ignoreEvents - Do no execute onclose event
calendar.getValue(); Get the current selected date
calendar.setValue(newValue); Set a new value for the javascript calendar and time picker
@param mixed newValue - New date should be set as YYYY-MM-DD HH:MM:SS
calendar.reset(); Reset the input value; Go to the next month
calendar.prev(); Go to the previous month


The following example shows how to interact with the JavaScript calendar programmatically

<script src=""></script>
<link rel="stylesheet" href="" type="text/css" />

<input type='button' value='Open the calendar' id="openbtn" />
<input type='button' value='Close the calendar' id="closebtn" />
<input type='button' value='Set value' id="setvaluebtn" />
<input type='button' value='Reset value' id="resetbtn" /><br>
<input id="calendar" />

let calendar = jSuites.calendar(document.getElementById('calendar'));

openbtn.onclick = () =>
closebtn.onclick = () => calendar.close()
setvaluebtn.onclick = () => calendar.setValue('2020-01-01')
resetbtn.onclick = () => calendar.reset()