Calendar clickable image

How do I make a clickable image next to my calendar text input? Once clicked on an image, the calendar will popup, once the date selected, it will close.

Currently my below code only clickable in the text input area.

window.onload = function() {
    cal1 = new dhtmlxCalendarObject('calInput1');

<form name="form1" method="post">
	<input type="text" id="calInput1" style="width: 200px; font-size:12px;" readonly="true">

You may find the solution in the sample:


Hi Support/Alexandra.

In this example dhtmlxCalendar/samples/01_initialization/07_calendar_sensitive.html, I cannot close the calendar without selecting the date. Seems like this example force the user to select the date.

How do I close the calendar WITHOUT select the date?


you may call hide() method to hide a calendar:


I have a similar problem, but in a grid header input. When i click the image the grid sorts the column.

Any Ideas.

Try to cancel bubbling for onlick event:

<img … onclick="(arguments[0]||event).cancelBubble=true; someFunction()"/>